Touch 2.0.2 Sencha Docs

Ext.DomQuery

Alternate names

Ext.dom.Query

Files

Provides functionality to select elements on the page based on a CSS selector. Delegates to document.querySelectorAll. More information can be found at http://www.w3.org/TR/css3-selectors/

All selectors, attribute filters and pseudos below can be combined infinitely in any order. For example div.foo:nth-child(odd)[@foo=bar].bar:first would be a perfectly valid selector.

Element Selectors:

  • * any element
  • E an element with the tag E
  • E F All descendent elements of E that have the tag F
  • E > F or E/F all direct children elements of E that have the tag F
  • E + F all elements with the tag F that are immediately preceded by an element with the tag E
  • E ~ F all elements with the tag F that are preceded by a sibling element with the tag E

Attribute Selectors:

The use of and quotes are optional. For example, div[@foo='bar'] is also a valid attribute selector.

  • E[foo] has an attribute "foo"
  • E[foo=bar] has an attribute "foo" that equals "bar"
  • E[foo=bar] has an attribute "foo" that starts with "bar"
  • E[foo$=bar] has an attribute "foo" that ends with "bar"
  • E[foo*=bar] has an attribute "foo" that contains the substring "bar"
  • E[foo%=2] has an attribute "foo" that is evenly divisible by 2
  • E[foo!=bar] has an attribute "foo" that does not equal "bar"

Pseudo Classes:

  • E:first-child E is the first child of its parent
  • E:last-child E is the last child of its parent
  • E:nth-child(n) E is the nth child of its parent (1 based as per the spec)
  • E:nth-child(odd) E is an odd child of its parent
  • E:nth-child(even) E is an even child of its parent
  • E:only-child E is the only child of its parent
  • E:checked E is an element that is has a checked attribute that is true (e.g. a radio or checkbox)
  • E:first the first E in the resultset
  • E:last the last E in the resultset
  • E:nth(n) the nth E in the resultset (1 based)
  • E:odd shortcut for :nth-child(odd)
  • E:even shortcut for :nth-child(even)
  • E:not(S) an E element that does not match simple selector S
  • E:has(S) an E element that has a descendent that matches simple selector S
  • E:next(S) an E element whose next sibling matches simple selector S
  • E:prev(S) an E element whose previous sibling matches simple selector S
  • E:any(S1|S2|S2) an E element which matches any of the simple selectors S1, S2 or S3//\

CSS Value Selectors:

  • E{display=none} css value "display" that equals "none"
  • E{display=none} css value "display" that starts with "none"
  • E{display$=none} css value "display" that ends with "none"
  • E{display*=none} css value "display" that contains the substring "none"
  • E{display%=2} css value "display" that is evenly divisible by 2
  • E{display!=none} css value "display" that does not equal "none"

Available since: 1.1.0

Defined By

Methods

Ext.DomQuery
view source
( el, selector ) : Boolean
Returns true if the passed element(s) match the passed simple selector (e.g. ...

Returns true if the passed element(s) match the passed simple selector (e.g. div.some-class or span:first-child)

Available since: 1.1.0

Parameters

  • el : String/HTMLElement/Array

    An element id, element or array of elements

  • selector : String

    The simple selector to test

Returns

Fires

    Ext.DomQuery
    view source
    ( el )private
    ...

    Available since: 2.0.0

    Parameters

    Ext.DomQuery
    view source
    ( selector, [root] ) : HTMLElement[]
    Selects a group of elements. ...

    Selects a group of elements.

    Available since: 1.1.0

    Parameters

    • selector : String

      The selector/xpath query (can be a comma separated list of selectors)

    • root : HTMLElement/String (optional)

      The start of the query (defaults to document).

    Returns

    • HTMLElement[]

      An Array of DOM elements which match the selector. If there are no matches, and empty Array is returned.

    Ext.DomQuery
    view source
    ( selector, [root] ) : HTMLElement
    Selects a single element. ...

    Selects a single element.

    Available since: 1.1.0

    Parameters

    • selector : String

      The selector/xpath query

    • root : HTMLElement/String (optional)

      The start of the query (defaults to document).

    Returns

    • HTMLElement

      The DOM element which matched the selector.

    Fires