Annotation of 2006/webapi/selectors-api/Overview.html, revision 1.113

1.1       avankest    1: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
                      2: 
1.11      avankest    3: <html lang=en-US>
1.20      lhunt       4:  <head><meta content="text/html;charset=UTF-8" http-equiv=Content-Type>
                      5: 
1.102     lhunt       6:   <title>Selectors API Level 1</title>
1.1       avankest    7: 
                      8:   <style type="text/css">
1.36      lhunt       9:        pre.idl { border:solid thin; background:#eee; color:#000; padding:0.5em }
1.50      lhunt      10:        pre.idl :link, pre.idl :visited { color:inherit; background:transparent }
1.20      lhunt      11: 
1.36      lhunt      12:        div.example { border-left:double; padding-left:1em }
                     13:        dfn { font-style:normal; font-weight:bolder }
                     14:        em.ct { font-style:normal; font-weight:normal; font-variant:small-caps }
                     15:        p.note {  margin-left:2em; color:green; font-style:italic; font-weight:bold }
                     16:        p.note:before { content:"Note: " }
                     17:        .issue { padding:.5em; border:solid red }
                     18:        .issue:before { content:"Issue: " }
                     19:        code { color:#FF4500; }
                     20:        code :link, code :visited { color:inherit }
                     21:        </style>
1.112     lhunt      22:   <link href="http://www.w3.org/StyleSheets/TR/W3C-WD" rel=stylesheet
1.29      lhunt      23:   type="text/css">
1.1       avankest   24: 
                     25:  <body>
1.11      avankest   26:   <div class=head>
1.31      lhunt      27:    <p><a href="http://www.w3.org/"><img alt=W3C height=48
                     28:     src="http://www.w3.org/Icons/w3c_home" width=72></a></p>
1.1       avankest   29: 
1.102     lhunt      30:    <h1 id=title>Selectors API Level 1</h1>
1.12      avankest   31:    <!-- "DOM Selectors" was not acceptable. "DOM Level 4 Selectors" and
1.36      lhunt      32:                conforming to the DOM specification template (if there is such a thing) is
                     33:                just silly so we got stuck with this weird name. -->
1.12      avankest   34:    
1.112     lhunt      35:    <h2 class="no-num no-toc" id=W3C-doctype>W3C Working Draft 28 June 2012</h2>
1.1       avankest   36: 
                     37:    <dl>
1.5       avankest   38:     <dt>This Version:
1.1       avankest   39: 
1.11      avankest   40:     <dd><a
1.112     lhunt      41:      href="http://www.w3.org/TR/2012/WD-selectors-api-20120628/">http://www.w3.org/TR/2012/WD-selectors-api-20120628/</a>
1.111     lhunt      42: 
                     43:     <dt>Latest Editor's Draft:
                     44: 
                     45:     <dd>Selectors API Level 1 <a
                     46:      href="http://dev.w3.org/2006/webapi/selectors-api/">http://dev.w3.org/2006/webapi/selectors-api/</a>
                     47: 
                     48:     <dd>Selectors API Level 2 <a
                     49:      href="http://dev.w3.org/2006/webapi/selectors-api2/">http://dev.w3.org/2006/webapi/selectors-api2/</a>
1.1       avankest   50: 
1.5       avankest   51:     <dt>Latest Version:
1.1       avankest   52: 
                     53:     <dd><a
                     54:      href="http://www.w3.org/TR/selectors-api/">http://www.w3.org/TR/selectors-api/</a>
                     55: 
1.12      avankest   56:     <dt>Previous Versions:
                     57: 
                     58:     <dd><a
1.112     lhunt      59:      href="http://www.w3.org/TR/2009/CR-selectors-api-20091222/">http://www.w3.org/TR/2009/CR-selectors-api-20091222/</a>
                     60: 
                     61:     <dd><a
1.102     lhunt      62:      href="http://www.w3.org/TR/2008/WD-selectors-api-20081114/">http://www.w3.org/TR/2008/WD-selectors-api-20081114/</a>
                     63: 
                     64:     <dd><a
1.44      lhunt      65:      href="http://www.w3.org/TR/2007/WD-selectors-api-20071221/">http://www.w3.org/TR/2007/WD-selectors-api-20071221/</a>
                     66: 
                     67:     <dd><a
1.31      lhunt      68:      href="http://www.w3.org/TR/2007/WD-selectors-api-20071019/">http://www.w3.org/TR/2007/WD-selectors-api-20071019/</a>
1.29      lhunt      69: 
                     70:     <dd><a
1.12      avankest   71:      href="http://www.w3.org/TR/2006/WD-selectors-api-20060926/">http://www.w3.org/TR/2006/WD-selectors-api-20060926/</a>
1.1       avankest   72: 
                     73:     <dd><a
                     74:      href="http://www.w3.org/TR/2006/WD-selectors-api-20060525/">http://www.w3.org/TR/2006/WD-selectors-api-20060525/</a>
                     75: 
1.20      lhunt      76:     <dt>Editors:
                     77: 
1.46      lhunt      78:     <dd><a href="http://annevankesteren.nl/">Anne van Kesteren</a> (<a
                     79:      href="http://www.opera.com/">Opera Software ASA</a>) &lt;<a
                     80:      href="mailto:annevk@opera.com">annevk@opera.com</a>&gt;
                     81: 
1.29      lhunt      82:     <dd><a href="http://lachy.id.au/">Lachlan Hunt</a> (<a
                     83:      href="http://www.opera.com/">Opera Software ASA</a>) &lt;<a
1.20      lhunt      84:      href="mailto:lachlan.hunt@lachy.id.au">lachlan.hunt@lachy.id.au</a>&gt;
1.1       avankest   85:    </dl>
                     86: 
1.11      avankest   87:    <p class=copyright><a
1.1       avankest   88:     href="http://www.w3.org/Consortium/Legal/ipr-notice#Copyright">Copyright</a>
1.112     lhunt      89:     © 2006-2012 <a href="http://www.w3.org/"><acronym
1.106     lhunt      90:     title="World Wide Web Consortium">W3C</acronym></a><sup>®</sup> (<a
                     91:     href="http://www.csail.mit.edu/"><acronym
                     92:     title="Massachusetts Institute of Technology">MIT</acronym></a>, <a
                     93:     href="http://www.ercim.eu/"><acronym
                     94:     title="European Research Consortium for Informatics and Mathematics">ERCIM</acronym></a>,
                     95:     <a href="http://www.keio.ac.jp/">Keio</a>), All Rights Reserved. W3C <a
1.31      lhunt      96:     href="http://www.w3.org/Consortium/Legal/ipr-notice#Legal_Disclaimer">liability</a>,
                     97:     <a
                     98:     href="http://www.w3.org/Consortium/Legal/ipr-notice#W3C_Trademarks">trademark</a>
                     99:     and <a
                    100:     href="http://www.w3.org/Consortium/Legal/copyright-documents">document
                    101:     use</a> rules apply.</p>
1.33      lhunt     102:   </div>
1.1       avankest  103: 
                    104:   <hr>
                    105: 
1.11      avankest  106:   <h2 class="no-num no-toc" id=abstract>Abstract</h2>
1.1       avankest  107: 
1.23      lhunt     108:   <p>Selectors, which are widely used in CSS, are patterns that match against
1.54      lhunt     109:    elements in a tree structure <a href="#SELECT"
                    110:    rel=biblioentry>[SELECT]<!--{{!SELECT}}--></a><a href="#CSS21"
1.69      lhunt     111:    rel=biblioentry>[CSS21]<!--{{CSS21}}--></a>. The Selectors API
1.108     lhunt     112:    specification defines methods for retrieving <a
                    113:    href="#element"><code>Element</code></a> nodes from the <abbr
                    114:    title="Document Object Model">DOM</abbr> by matching against a group of
                    115:    selectors. It is often desirable to perform DOM operations on a specific
                    116:    set of elements in a document. These methods simplify the process of
                    117:    acquiring specific elements, especially compared with the more verbose
                    118:    techniques defined and used in the past.
1.1       avankest  119: 
1.11      avankest  120:   <h2 class="no-num no-toc" id=sotd>Status of this Document</h2>
1.1       avankest  121: 
                    122:   <p><em>This section describes the status of this document at the time of
                    123:    its publication. Other documents may supersede this document. A list of
                    124:    current W3C publications and the latest revision of this technical report
                    125:    can be found in the <a href="http://www.w3.org/TR/">W3C technical reports
                    126:    index</a> at http://www.w3.org/TR/.</em>
                    127: 
1.112     lhunt     128:   <p>This is the 28 June 2012 Last Call Working Draft of "Selectors API". The
                    129:    W3C Membership and other interested parties are invited to review the
                    130:    document and send comments to <a
1.57      lhunt     131:    href="mailto:public-webapps@w3.org">public-webapps@w3.org</a> (<a
                    132:    href="http://lists.w3.org/Archives/Public/public-webapps/">public
1.112     lhunt     133:    archive</a>) with <kbd>[selectors-api]</kbd> in the subject, through 19
                    134:    July 2012. (Please note that a different list was used until mid 2008, so
1.102     lhunt     135:    some old messages are <a
                    136:    href="http://lists.w3.org/Archives/Public/public-webapi/">archived there
1.112     lhunt     137:    instead</a>).
                    138: 
                    139:   <p>Web content and browser developers are encouraged to review this draft.
                    140:    This draft is considered very stable and is expected to progress to
                    141:    Candidate Recommendation after the review period. The <a
                    142:    href="http://www.w3.org/2008/webapps/">Web Applications (WebApps) Working
                    143:    Group</a> has developed a comprehensive <a
                    144:    href="http://dev.w3.org/2006/webapi/selectors-api-testsuite/">Selectors
                    145:    API test suite</a>.
1.1       avankest  146: 
1.29      lhunt     147:   <p>This document was developed by the <a
1.57      lhunt     148:    href="http://www.w3.org/2008/webapps/">Web Applications Working Group</a>.
                    149:    The Working Group expects to advance this Working Draft to Recommendation
1.29      lhunt     150:    Status.
                    151: 
1.113   ! lhunt     152:   <p>Publication as a Working Draft does not imply endorsement by the W3C
        !           153:    Membership. This is a draft document and may be updated, replaced or
        !           154:    obsoleted by other documents at any time. It is inappropriate to cite this
        !           155:    document as other than work in progress.
1.1       avankest  156: 
                    157:   <p>This document was produced by a group operating under the <a
                    158:    href="http://www.w3.org/Consortium/Patent-Policy-20040205/">5 February
                    159:    2004 W3C Patent Policy</a>. W3C maintains a <a
1.77      lhunt     160:    href="http://www.w3.org/2004/01/pp-impl/42538/status"
1.11      avankest  161:    rel=disclosure>public list of any patent disclosures</a> made in
1.1       avankest  162:    connection with the deliverables of the group; that page also includes
                    163:    instructions for disclosing a patent. An individual who has actual
                    164:    knowledge of a patent which the individual believes contains <a
                    165:    href="http://www.w3.org/Consortium/Patent-Policy-20040205/#def-essential">Essential
1.31      lhunt     166:    Claim(s)</a> must disclose the information in accordance with <a
1.1       avankest  167:    href="http://www.w3.org/Consortium/Patent-Policy-20040205/#sec-Disclosure">section
                    168:    6 of the W3C Patent Policy</a>.
                    169: 
1.11      avankest  170:   <h2 class="no-num no-toc" id=toc>Table of Contents</h2>
1.1       avankest  171:   <!--begin-toc-->
                    172: 
1.11      avankest  173:   <ul class=toc>
1.102     lhunt     174:    <li><a href="#introduction"><span class=secno>1. </span>Introduction</a>
1.11      avankest  175:     <ul class=toc>
1.102     lhunt     176:      <li><a href="#examples"><span class=secno>1.1. </span>Examples</a>
1.49      lhunt     177:     </ul>
1.1       avankest  178: 
1.102     lhunt     179:    <li><a href="#conformance"><span class=secno>2. </span>Conformance
1.49      lhunt     180:     Requirements</a>
                    181:     <ul class=toc>
1.102     lhunt     182:      <li><a href="#terminology"><span class=secno>2.1. </span>Terminology and
1.49      lhunt     183:       Conventions</a>
                    184:     </ul>
1.1       avankest  185: 
1.102     lhunt     186:    <li><a href="#interoperability"><span class=secno>3.
1.49      lhunt     187:     </span>Interoperability Considerations</a>
                    188:     <ul class=toc>
1.102     lhunt     189:      <li><a href="#extensibility"><span class=secno>3.1.
1.49      lhunt     190:       </span>Extensibility</a>
                    191:     </ul>
                    192: 
1.102     lhunt     193:    <li><a href="#security"><span class=secno>4. </span>Security
1.49      lhunt     194:     Considerations</a>
1.21      lhunt     195: 
1.102     lhunt     196:    <li><a href="#privacy"><span class=secno>5. </span>Privacy Considerations
1.49      lhunt     197:     </a>
1.1       avankest  198: 
1.102     lhunt     199:    <li><a href="#the-apis"><span class=secno>6. </span>The APIs</a>
1.16      avankest  200:     <ul class=toc>
1.108     lhunt     201:      <li><a href="#interface-definitions"><span class=secno>6.1.
                    202:       </span>Interface Definitions</a>
1.99      lhunt     203: 
1.108     lhunt     204:      <li><a href="#findelements"><span class=secno>6.2. </span>Finding
                    205:       Elements</a>
                    206: 
                    207:      <li><a href="#grammar"><span class=secno>6.3. </span>Grammar</a>
                    208: 
                    209:      <li><a href="#processing-selectors"><span class=secno>6.4.
1.99      lhunt     210:       </span>Processing Selectors</a>
                    211: 
1.108     lhunt     212:      <li><a href="#resolving-namespaces"><span class=secno>6.5.
1.87      lhunt     213:       </span>Resolving Namespaces</a>
1.51      lhunt     214:     </ul>
1.50      lhunt     215: 
1.102     lhunt     216:    <li><a href="#dom-feature-string"><span class=secno>7. </span>DOM Feature
1.64      lhunt     217:     String</a>
                    218: 
1.102     lhunt     219:    <li><a href="#examples0"><span class=secno>8. </span>Examples</a>
1.64      lhunt     220: 
1.11      avankest  221:    <li class=no-num><a href="#references">References</a>
1.54      lhunt     222:     <ul class=toc>
                    223:      <li class=no-num><a href="#normative-references">Normative
                    224:       references</a>
                    225: 
1.84      lhunt     226:      <li class=no-num><a href="#informative-references">Informative
                    227:       references</a>
1.54      lhunt     228:     </ul>
1.1       avankest  229: 
1.11      avankest  230:    <li class=no-num><a href="#acknowledgements">Acknowledgements</a>
1.1       avankest  231:   </ul>
                    232:   <!--end-toc-->
                    233: 
1.102     lhunt     234:   <h2 id=introduction><span class=secno>1. </span>Introduction</h2>
1.1       avankest  235: 
                    236:   <p><em>This section is non-normative.</em>
                    237: 
1.108     lhunt     238:   <p>This specification provides methods for selecting and testing elements
                    239:    based on whether or not they match a given selector. With these methods
                    240:    methods, it is easier to match a set of <a
                    241:    href="#element"><code>Element</code></a> nodes based on specific criteria,
                    242:    than having to subsequently filter the result of calling other methods
                    243:    like <code>getElementsByTagName()</code>.
1.10      avankest  244: 
1.102     lhunt     245:   <h3 id=examples><span class=secno>1.1. </span>Examples</h3>
1.1       avankest  246: 
                    247:   <p><em>This section is non-normative.</em>
                    248: 
1.54      lhunt     249:   <p>Some ECMAScript <a href="#ECMA-262"
                    250:    rel=biblioentry>[ECMA-262]<!--{{ECMA-262}}--></a> examples:
1.1       avankest  251: 
1.14      avankest  252:   <div class=example>
1.41      lhunt     253:    <p>This is an example table written in HTML 4.01.</p>
1.22      lhunt     254: 
1.20      lhunt     255:    <pre>&lt;table id="score">
                    256:   &lt;thead>
                    257:     &lt;tr>
                    258:       &lt;th>Test
                    259:       &lt;th>Result
                    260:   &lt;tfoot>
                    261:     &lt;tr>
                    262:       &lt;th>Average
                    263:       &lt;td>82%
                    264:   &lt;tbody>
                    265:     &lt;tr>
                    266:       &lt;td>A
                    267:       &lt;td>87%
                    268:     &lt;tr>
                    269:       &lt;td>B
                    270:       &lt;td>78%
                    271:     &lt;tr>
                    272:       &lt;td>C
                    273:       &lt;td>81%
                    274: &lt;/table></pre>
                    275: 
                    276:    <p>In order to obtain the cells containing the results in the table, which
                    277:     might be done, for example, to plot the values on a graph, there are at
                    278:     least two approaches that may be taken. Using only the APIs from DOM
                    279:     Level 2, it requires a script like the following that iterates through
                    280:     each <code>tr</code> within each <code>tbody</code> in the
                    281:     <code>table</code> to find the second cell of each row.</p>
                    282: 
                    283:    <pre>var table = document.getElementById("score");
1.23      lhunt     284: var groups = table.tBodies;
                    285: var rows = null;
1.24      lhunt     286: var cells = [];
1.20      lhunt     287: 
1.23      lhunt     288: for (var i = 0; i &lt; groups.length; i++) {
                    289:   rows = groups[i].rows;
                    290:   for (var j = 0; j &lt; rows.length; j++) {
                    291:     cells.push(rows[j].cells[1]);
1.20      lhunt     292:   }
1.36      lhunt     293: }</pre>
1.20      lhunt     294: 
1.46      lhunt     295:    <p>Alternatively, using the <code
                    296:     title=document-selectallelements>querySelectorAll()</code> method, that
                    297:     script becomes much more concise.</p>
1.20      lhunt     298: 
1.36      lhunt     299:    <pre>var cells = document.querySelectorAll("#score&gt;tbody&gt;tr&gt;td:nth-of-type(2)");</pre>
1.41      lhunt     300: 
1.84      lhunt     301:    <p>Note that the script operates on the DOM and works independently from
                    302:     the syntax used to create the document. Thus this script will also work
                    303:     correctly for an equivalent table created from well-formed XHTML instead
                    304:     of HTML, or dynamically created and inserted into a document using DOM
                    305:     APIs.</p>
1.20      lhunt     306:   </div>
                    307: 
1.102     lhunt     308:   <h2 id=conformance><span class=secno>2. </span>Conformance Requirements</h2>
1.1       avankest  309: 
1.21      lhunt     310:   <p>All diagrams, examples and notes in this specification are
1.20      lhunt     311:    non-normative, as are all sections explicitly marked non-normative.
                    312:    Everything else in this specification is normative.
1.1       avankest  313: 
1.73      lhunt     314:   <p>The key words <em class=ct>must</em>, <em class=ct>must not</em>, <em
                    315:    class=ct>should</em>, <em class=ct>may</em> and <em
                    316:    class=ct>recommended</em> in the normative parts of this document are to
                    317:    be interpreted as described in RFC 2119 <a href="#RFC2119"
1.54      lhunt     318:    rel=biblioentry>[RFC2119]<!--{{!RFC2119}}--></a>.
1.1       avankest  319: 
1.11      avankest  320:   <p>The following conformance classes are defined (and considered) by this
                    321:    specification:
1.1       avankest  322: 
                    323:   <dl>
1.87      lhunt     324:    <dt><dfn id=conforming-user-agent>conforming user agent</dfn>
1.1       avankest  325: 
1.108     lhunt     326:    <dd>A user agent that implements the interfaces described in this
                    327:     specification and conforms to all <em class=ct>must</em>-level criteria
                    328:     that apply to implementations.
1.22      lhunt     329: 
1.87      lhunt     330:    <dt><dfn id=conforming-application>conforming application</dfn>
1.22      lhunt     331: 
                    332:    <dd>An application that uses the interfaces defined in this specification
1.36      lhunt     333:     and conforms to all <em class=ct>must</em>-level criteria that apply to
                    334:     applications.
1.1       avankest  335:   </dl>
                    336: 
1.102     lhunt     337:   <h3 id=terminology><span class=secno>2.1. </span>Terminology and
                    338:    Conventions</h3>
1.16      avankest  339: 
1.54      lhunt     340:   <p>The terminology used in this specification is that from Selectors <a
                    341:    href="#SELECT" rel=biblioentry>[SELECT]<!--{{!SELECT}}--></a>.
1.16      avankest  342: 
1.108     lhunt     343:   <p>The following features are defined in the DOM Level 3 Core specification
                    344:    <a href="#DOM-LEVEL-3-CORE"
                    345:    rel=biblioentry>[DOM-LEVEL-3-CORE]<!--{{!DOM-LEVEL-3-CORE}}--></a>:
                    346: 
                    347:   <ul>
                    348:    <li><dfn id=document title=dom-document><code>Document</code></dfn>
                    349:     interface.
                    350: 
                    351:    <li><dfn id=documentfragment><code>DocumentFragment</code></dfn>
                    352:     interface.
                    353: 
                    354:    <li><dfn id=element><code>Element</code></dfn> interface.
                    355: 
                    356:    <li><dfn id=nodelist><code>NodeList</code></dfn> interface.
                    357:   </ul>
                    358: 
1.73      lhunt     359:   <p>Conformance requirements phrased as algorithms or specific steps <em
                    360:    class=ct>may</em> be implemented in any manner, so long as the end result
                    361:    is equivalent.
1.16      avankest  362: 
1.90      lhunt     363:   <p>The IDL used in this specification uses the syntax defined in Web IDL <a
                    364:    href="#WEBIDL" rel=biblioentry>[WEBIDL]<!--{{!WEBIDL}}--></a>.
                    365: 
1.23      lhunt     366:   <p>The construction "<code>Foo</code> object", where <code>Foo</code> is
                    367:    actually an interface, is sometimes used instead of the more accurate
1.24      lhunt     368:    "object implementing the <code>Foo</code> interface".
1.23      lhunt     369: 
1.102     lhunt     370:   <h2 id=interoperability><span class=secno>3. </span>Interoperability
1.49      lhunt     371:    Considerations</h2>
1.16      avankest  372: 
1.23      lhunt     373:   <p><em>This section is non-normative.</em>
                    374: 
1.65      lhunt     375:   <p>Some implementations might have different levels of support for
                    376:    Selectors. If some implementations lack support for some selectors, then
1.87      lhunt     377:    the use of such selectors will result in those implementations failing to
                    378:    return the expected results. Authors are advised to check for the DOM
                    379:    Exceptions thrown by these APIs and provide a fallback for graceful
                    380:    degradation.
1.19      avankest  381: 
1.102     lhunt     382:   <h3 id=extensibility><span class=secno>3.1. </span>Extensibility</h3>
1.5       avankest  383: 
                    384:   <p><em>This section is non-normative.</em>
                    385: 
                    386:   <p>Extensions of the APIs defined in this specification are <em>strongly
1.36      lhunt     387:    discouraged</em>. Implementors, Working Groups and other interested
                    388:    parties should discuss extensions on a relevant public forum, such as <a
1.57      lhunt     389:    href="mailto:public-webapps@w3.org">public-webapps@w3.org</a>.
1.5       avankest  390: 
1.102     lhunt     391:   <h2 id=security><span class=secno>4. </span>Security Considerations</h2>
1.11      avankest  392: 
                    393:   <p>It is expected that implementing this specification introduces no new
1.21      lhunt     394:    security risks for users.
                    395: 
1.62      lhunt     396:   <p>If, at any time, the implementation detects a situation which would
1.73      lhunt     397:    violate security policies, the implementation <em class=ct>may</em> abort
                    398:    and raise a security exception. If any other error condition occurs which
                    399:    is not covered directly by this or any other relevant specification, the
                    400:    implementation <em class=ct>may</em> abort and raise an appropriate,
1.62      lhunt     401:    language-binding-specific or implementation-specific exception.
                    402: 
1.102     lhunt     403:   <h2 id=privacy><span class=secno>5. </span>Privacy Considerations</h2>
1.11      avankest  404: 
1.20      lhunt     405:   <p>History theft is a potential privacy issue because the
1.54      lhunt     406:    <code>:visited</code> pseudo-class in Selectors <a href="#SELECT"
                    407:    rel=biblioentry>[SELECT]<!--{{!SELECT}}--></a> allows authors to query
                    408:    which links have been visited.
1.20      lhunt     409: 
                    410:   <p class=note>This is not a new problem, as it can already be exploited
                    411:    using existing CSS and DOM APIs, such as <code>getComputedStyle()</code>
1.54      lhunt     412:    <a href="#DOM-LEVEL-2-STYLE"
                    413:    rel=biblioentry>[DOM-LEVEL-2-STYLE]<!--{{DOM-LEVEL-2-STYLE}}--></a>.
1.20      lhunt     414: 
                    415:   <div class=example>
1.36      lhunt     416:    <p>In this example, <var>vlinks</var> will acquire a list of links that
                    417:     the user has visited. The author can then obtain the URIs and potentially
1.20      lhunt     418:     exploit this knowledge.</p>
                    419: 
1.27      lhunt     420:    <pre>var vlinks = document.querySelectorAll(":visited");
1.20      lhunt     421: for (var i = 0; i &lt; vlinks.length; i++) {
                    422:   doSomethingEvil(vlinks[i].href);
                    423: }</pre>
                    424:   </div>
                    425: 
                    426:   <p>As <a href="http://www.w3.org/TR/css3-selectors/#link">defined in
1.54      lhunt     427:    <cite>Selectors</cite></a> (<a href="#SELECT"
                    428:    rel=biblioentry>[SELECT]<!--{{!SELECT}}--></a>, section 6.6.1), user
                    429:    agents <em class=ct>may</em> treat all links as unvisited links. It is <em
1.47      lhunt     430:    class=ct>recommended</em> that implementations behave consistently with
                    431:    other uses of Selectors supported by the user agent.
1.11      avankest  432: 
1.102     lhunt     433:   <h2 id=the-apis><span class=secno>6. </span>The APIs</h2>
1.36      lhunt     434: 
                    435:   <p>The term <dfn id=first>first</dfn> used in the definitions of the
1.99      lhunt     436:    methods defined in this specification means <em>first in document
                    437:    order</em>. The term <dfn id=document-order>document order</dfn> means a
                    438:    depth-first pre-order traversal of the DOM tree or subtree in question.
                    439:    The term <dfn id=context-node>context node</dfn> refers to the node upon
1.108     lhunt     440:    which the method was invoked. The term <dfn id=subtrees>subtrees</dfn>
                    441:    refers to the collection of elements that are descendants of the <a
                    442:    href="#context-node">context node</a>. The term <dfn
1.99      lhunt     443:    id=matching-element-node>matching <code>Element</code> node</dfn> refers
1.108     lhunt     444:    to an <a href="#element"><code>Element</code></a> node that matches the <a
                    445:    href="#selector-string">selector string</a> (<var>selectors</var>) that
                    446:    was passed to the method, according to the rules for matching elements
                    447:    defined in Selectors <a href="#SELECT"
1.102     lhunt     448:    rel=biblioentry>[SELECT]<!--{{!SELECT}}--></a>.
1.65      lhunt     449: 
1.108     lhunt     450:   <h3 id=interface-definitions><span class=secno>6.1. </span>Interface
                    451:    Definitions</h3>
1.99      lhunt     452: 
1.108     lhunt     453:   <pre class=idl>partial interface <a href="#document"
                    454:    title=dom-document>Document</a> {
1.110     lhunt     455:   Element?  <a href="#queryselector"
1.108     lhunt     456:    title=queryselector>querySelector</a>(DOMString selectors);
                    457:   NodeList  <a
                    458:    href="#queryselectorall"
                    459:    title=queryselectorall>querySelectorAll</a>(DOMString selectors);
                    460: };
                    461: 
                    462: partial interface <a
                    463:    href="#documentfragment">DocumentFragment</a> {
1.110     lhunt     464:   Element?  <a
1.106     lhunt     465:    href="#queryselector"
1.108     lhunt     466:    title=queryselector>querySelector</a>(DOMString selectors);
                    467:   NodeList  <a
                    468:    href="#queryselectorall"
                    469:    title=queryselectorall>querySelectorAll</a>(DOMString selectors);
                    470: };
                    471: 
                    472: partial interface <a
                    473:    href="#element">Element</a> {
1.110     lhunt     474:   Element?  <a href="#queryselector"
1.108     lhunt     475:    title=queryselector>querySelector</a>(DOMString selectors);
                    476:   NodeList  <a
1.106     lhunt     477:    href="#queryselectorall"
1.108     lhunt     478:    title=queryselectorall>querySelectorAll</a>(DOMString selectors);
                    479: };
                    480: </pre>
                    481: 
                    482:   <h3 id=findelements><span class=secno>6.2. </span>Finding Elements</h3>
                    483: 
                    484:   <p>The <var>selectors</var> argument for the <a
                    485:    href="#queryselector"><code>querySelector</code></a> and <a
                    486:    href="#queryselectorall"><code>querySelectorAll</code></a> methods accepts
                    487:    a <a href="#selector-string">selector string</a>.
1.99      lhunt     488: 
1.53      lhunt     489:   <p>The <dfn id=queryselector
1.108     lhunt     490:    title=queryselector><code>querySelector()</code></dfn> methods on the <a
                    491:    href="#document"><code title=dom-document>Document</code></a>, <a
                    492:    href="#documentfragment"><code>DocumentFragment</code></a>, and <a
                    493:    href="#element"><code>Element</code></a> interfaces <em class=ct>must</em>
                    494:    return the <a href="#first">first</a> matching <a
                    495:    href="#element"><code>Element</code></a> node within the <a
                    496:    href="#subtrees">subtrees</a> of the <a href="#context-node">context
                    497:    node</a>. If there is no matching <a
                    498:    href="#element"><code>Element</code></a>, the method <em
                    499:    class=ct>must</em> return <code>null</code>.
1.1       avankest  500: 
1.53      lhunt     501:   <p>The <dfn id=queryselectorall
1.108     lhunt     502:    title=queryselectorall><code>querySelectorAll()</code></dfn> methods on
                    503:    the <a href="#document"><code title=dom-document>Document</code></a>, <a
                    504:    href="#documentfragment"><code>DocumentFragment</code></a>, and <a
                    505:    href="#element"><code>Element</code></a> interfaces <em class=ct>must</em>
                    506:    return a <a href="#nodelist"><code>NodeList</code></a> containing all of
                    507:    the matching <a href="#element"><code>Element</code></a> nodes within the
                    508:    <a href="#subtrees">subtrees</a> of the <a href="#context-node">context
                    509:    node</a>, in <a href="#document-order">document order</a>. If there are no
                    510:    matching nodes, the method <em class=ct>must</em> return an empty <a
                    511:    href="#nodelist"><code>NodeList</code></a>.
1.99      lhunt     512: 
1.108     lhunt     513:   <p>The <a href="#nodelist"><code>NodeList</code></a> object returned by the
                    514:    <a href="#queryselectorall"><code>querySelectorAll()</code></a> method <em
1.99      lhunt     515:    class=ct>must</em> be static, not <a
                    516:    href="http://www.w3.org/TR/DOM-Level-3-Core/core.html#td-live"
                    517:    title="Document Object Model Core">live</a> (<a href="#DOM-LEVEL-3-CORE"
                    518:    rel=biblioentry>[DOM-LEVEL-3-CORE]<!--{{!DOM-LEVEL-3-CORE}}--></a>,
                    519:    section 1.1.1). Subsequent changes to the structure of the underlying
1.108     lhunt     520:    document <em class=ct>must not</em> be reflected in the <a
                    521:    href="#nodelist"><code>NodeList</code></a> object. This means that the
                    522:    object will instead contain a list of matching <a
                    523:    href="#element"><code>Element</code></a> nodes that were in the document
                    524:    at the time the list was created.
1.99      lhunt     525: 
1.108     lhunt     526:   <h3 id=grammar><span class=secno>6.3. </span>Grammar</h3>
1.99      lhunt     527: 
1.108     lhunt     528:   <p>A <dfn id=selector-string>selector string</dfn> is a list of one or more
                    529:    <a href="http://dev.w3.org/csswg/selectors4/#complex">group of
1.99      lhunt     530:    selectors</a> (<a href="#SELECT"
1.108     lhunt     531:    rel=biblioentry>[SELECT]<!--{{!SELECT}}--></a>, section 5) that <em
                    532:    class=ct>may</em> be surrounded by whitespace and matches the
                    533:    <code>dom_selectors_group</code> production.
                    534: 
                    535:   <pre>
                    536: dom_selectors_group
                    537:   : S* [ selectors_group ] S*
                    538:   ;
                    539:        </pre>
                    540: 
                    541:   <p>The productions for <code>selectors_group</code> is defined in Selectors
                    542:    Level 3 (<a href="#SELECT" rel=biblioentry>[SELECT]<!--{{!SELECT}}--></a>,
                    543:    section 10.1). These groups of selectors <em class=ct>should not</em> use
                    544:    <a href="#namespace-prefix-needs-to-be-resolved"
1.87      lhunt     545:    title=need-to-resolve>namespace prefixes that need to be resolved</a>.
1.36      lhunt     546: 
1.96      lhunt     547:   <p class=note>Implementers are advised that if <code>null</code> or
                    548:    <code>undefined</code> are passed as the value of the <var>selectors</var>
                    549:    parameter, they are to be handled as defined in WebIDL <a href="#WEBIDL"
                    550:    rel=biblioentry>[WEBIDL]<!--{{!WEBIDL}}--></a>. Authors are advised to
                    551:    avoid passing these values.
                    552: 
1.36      lhunt     553:   <p class=note>Authors are advised that while the use of pseudo-elements in
                    554:    selectors is permitted, they will not match any elements in the document,
                    555:    and thus would not result in any elements being returned. Therefore,
1.73      lhunt     556:    authors are advised to avoid the use of pseudo-elements in selectors that
                    557:    are passed to the methods defined in this specification.
1.36      lhunt     558: 
1.108     lhunt     559:   <h3 id=processing-selectors><span class=secno>6.4. </span>Processing
                    560:    Selectors</h3>
                    561: 
                    562:   <p>The steps to <dfn id=parse-a-selector>parse a selector</dfn> are as
                    563:    follows:
                    564: 
                    565:   <ol>
                    566:    <li>
                    567:     <p>Let <var>selectors</var> be the <a href="#selector-string">selector
                    568:      string</a> input to this algorithm.
                    569: 
                    570:    <li>
                    571:     <p>If <a href="#selector-string">selector string</a> matches the grammar
                    572:      for <code>dom_selectors_group</code>, let <var>result</var> be the group
                    573:      of selectors returned as a result of parsing the <var>selectors</var>
                    574:      according to the grammar for <code>dom_selectors_group</code> defined
                    575:      above.
                    576: 
                    577:    <li>
                    578:     <p>Otherwise, <a
                    579:      href="http://www.w3.org/TR/DOM-Level-3-Core/core.html#DOMException-SYNTAX_ERR">raise
                    580:      a <code>SYNTAX_ERR</code> exception</a> (<a href="#DOM-LEVEL-3-CORE"
                    581:      rel=biblioentry>[DOM-LEVEL-3-CORE]<!--{{!DOM-LEVEL-3-CORE}}--></a>,
                    582:      section 1.4) and abort this algorithm.</p>
                    583: 
                    584:    <li>Return <var>result</var>.
                    585:   </ol>
                    586: 
                    587:   <p>The steps to <dfn id=evaluate-a-selector>evaluate a selector</dfn> are
                    588:    as follows:
                    589: 
                    590:   <ol>
                    591:    <li>
                    592:     <p>Let <var title="">element</var> be the element being evaluated.
                    593: 
                    594:    <li>
                    595:     <p>Let <var>selector group</var> be the selector input into this
                    596:      algotihm.
                    597: 
                    598:    <li>
                    599:     <p>If any selector in <var>selector group</var> matches <var
                    600:      title="">element</var>, return true. Otherwise, return false.
                    601:   </ol>
                    602: 
                    603:   <p>Selectors are evaluated against a given element in the context of the
                    604:    entire DOM tree in which the element is located.
1.20      lhunt     605: 
1.50      lhunt     606:   <p>If the user agent also supports some level of CSS, the implementation
                    607:    <em class=ct>should</em> support the same set of selectors in both these
                    608:    APIs and CSS.
1.1       avankest  609: 
1.108     lhunt     610:   <h3 id=resolving-namespaces><span class=secno>6.5. </span>Resolving
1.87      lhunt     611:    Namespaces</h3>
1.50      lhunt     612: 
1.87      lhunt     613:   <p>If the group of selectors include <a
                    614:    href="#namespace-prefix-needs-to-be-resolved"
1.65      lhunt     615:    title=need-to-resolve>namespace prefixes that need to be resolved</a>, the
1.73      lhunt     616:    implementation <em class=ct>must</em> <a
1.109     lhunt     617:    href="http://www.w3.org/TR/DOM-Level-3-Core/core.html#DOMException-SYNTAX_ERR">raise
                    618:    a <code>SYNTAX_ERR</code> exception</a> (<a href="#DOM-LEVEL-3-CORE"
1.54      lhunt     619:    rel=biblioentry>[DOM-LEVEL-3-CORE]<!--{{!DOM-LEVEL-3-CORE}}--></a>,
                    620:    section 1.4).
1.50      lhunt     621: 
1.86      lhunt     622:   <p class=note>This specification does not provide support for resolving
                    623:    arbitrary namespace prefixes. However, support for a namespace prefix
                    624:    resolution mechanism may be considered for inclusion in a future version
                    625:    of this specification.
                    626: 
1.87      lhunt     627:   <p>A <dfn id=namespace-prefix-needs-to-be-resolved
                    628:    title=need-to-resolve>namespace prefix needs to be resolved</dfn> if the
                    629:    namespace component is neither empty (e.g. <code>|div</code>),
                    630:    representing the null namespace, or an asterisk (e.g. <code>*|div</code>),
                    631:    representing any namespace. Since the asterisk or empty namespace prefix
                    632:    do not need to be resolved, implementations that support the namespace
                    633:    syntax in Selectors <em class=ct>must</em> support these. <a
                    634:    href="#SELECT" rel=biblioentry>[SELECT]<!--{{!SELECT}}--></a>
1.60      lhunt     635: 
1.102     lhunt     636:   <h2 id=dom-feature-string><span class=secno>7. </span>DOM Feature String</h2>
1.64      lhunt     637: 
1.70      lhunt     638:   <p>DOM3 Core defines several methods for checking for interface support, or
                    639:    for obtaining implementations of interfaces, using <a
1.64      lhunt     640:    href="http://www.w3.org/TR/DOM-Level-3-Core/core.html#DOMFeatures">feature
1.94      lhunt     641:    strings</a> (<a href="#DOM-LEVEL-3-CORE"
1.65      lhunt     642:    rel=biblioentry>[DOM-LEVEL-3-CORE]<!--{{!DOM-LEVEL-3-CORE}}--></a>,
1.94      lhunt     643:    section 1.3.6). A DOM application can use these methods, each of which
1.70      lhunt     644:    accept <var>feature</var> and <var>version</var> parameters, using the
                    645:    values "<code title="">Selectors-API</code>" and "<code>1.0</code>"
                    646:    (respectively).
                    647: 
                    648:   <p>Conforming implementations <em class=ct>must</em> respond with a
                    649:    <code>true</code> value when the <code>hasFeature</code> method is queried
                    650:    with these values. Authors are cautioned, however, that implementations
                    651:    returning <code>true</code> might not be perfectly compliant, and that
                    652:    implementations returning <code>false</code> might well have support for
                    653:    features in this specification; in general, therefore, use of this method
                    654:    is discouraged.
1.64      lhunt     655: 
1.102     lhunt     656:   <h2 id=examples0><span class=secno>8. </span>Examples</h2>
1.64      lhunt     657: 
1.22      lhunt     658:   <div class=example>
1.72      lhunt     659:    <p>The following examples make use of this sample XHTML document.</p>
1.20      lhunt     660: 
1.72      lhunt     661:    <pre>&lt;html xmlns="http://www.w3.org/1999/xhtml">
1.22      lhunt     662:   &lt;head>
                    663:     &lt;title&gt;Selectors API Example&lt;/title&gt;
                    664:   &lt;/head>
                    665:   &lt;body>
1.72      lhunt     666:     &lt;div id="foo"&gt;
                    667:       &lt;p class="warning"&gt;This is a sample warning&lt;/p&gt;
                    668:       &lt;p class="error"&gt;This is a sample error&lt;/p&gt;
                    669:     &lt;/div&gt;
                    670:     &lt;div id="bar"&gt;
                    671:       &lt;p&gt;...&lt;/p&gt;
                    672:     &lt;/div&gt;
1.22      lhunt     673:   &lt;/body>
1.36      lhunt     674: &lt;/html></pre>
1.20      lhunt     675: 
1.65      lhunt     676:    <p>The methods accept a group of selectors (comma separated) as the
                    677:     argument. The following example would select all <code>p</code> elements
                    678:     in the document that have a class of either "<code>error</code>" or
                    679:     "<code>warning</code>".</p>
                    680: 
                    681:    <pre>var alerts = document.querySelectorAll("p.warning, p.error");</pre>
1.21      lhunt     682: 
1.65      lhunt     683:    <p>The <code title=document-selectelement>querySelector()</code> methods
                    684:     also accept a group of selectors and they will return the first element
                    685:     (if any) that matches any of the selectors in the group.</p>
                    686: 
                    687:    <pre>var x = document.querySelector("#foo, #bar");</pre>
                    688: 
                    689:    <p><var>x</var> would contain the first element in the document with an ID
1.94      lhunt     690:     of either <code>foo</code> or <code>bar</code>, or <code>null</code> if
                    691:     there is no such element. In the sample document above, it would select
                    692:     the <code>div</code> element with the ID of <code>foo</code> because it
                    693:     is first in document order. The order of the selectors used in the
                    694:     parameter has no effect and would have the same result if the order were
                    695:     reversed, as in:</p>
1.81      lhunt     696: 
                    697:    <pre>var x = document.querySelector("#bar, #foo");</pre>
                    698: 
                    699:    <p>The methods can also be invoked on elements. In the following example,
                    700:     assume the event handler is registered on an element, and thus the method
                    701:     is invoked on the target element of the event.</p>
1.22      lhunt     702: 
1.65      lhunt     703:    <pre>function handle(evt) {
                    704:   var x = evt.target.querySelector("span");
                    705:   ...
                    706:   // Do something with x
1.21      lhunt     707: }</pre>
1.14      avankest  708: 
1.74      lhunt     709:    <p>Even though the method is invoked on an element, selectors are still
                    710:     evaluated in the context of the entire document. In the following
                    711:     example, the method will still match the <code>div</code> element's child
                    712:     <code>p</code> element, even though the <code>body</code> element is not
                    713:     a descendant of the <code>div</code> element itself.</p>
                    714: 
                    715:    <pre>var div = document.getElementById("bar");
1.80      lhunt     716: var p = div.querySelector("body p");</pre>
1.74      lhunt     717: 
1.72      lhunt     718:    <p>Given this sample fragment that contains a list as a navigation menu:</p>
                    719: 
                    720:    <pre>&lt;ul class="nav"&gt;
                    721:   &lt;li&gt;&lt;a href="/"&gt;Home&lt;/a&gt;&lt;/li&gt;
                    722:   &lt;li&gt;&lt;a href="/products"&gt;Products&lt;/a&gt;&lt;/li&gt;
                    723:   &lt;li&gt;&lt;a href="/about"&gt;About&lt;/a&gt;&lt;/li&gt;
                    724: &lt;/ul&gt;</pre>
                    725: 
                    726:    <p>The following example selects all the <code>li</code> elements and
1.108     lhunt     727:     demonstrates how to iterate through the collection in a <a
                    728:     href="#nodelist"><code>NodeList</code></a>.</p>
1.21      lhunt     729: 
1.41      lhunt     730:    <pre>var lis = document.querySelectorAll("ul.nav&gt;li");
1.24      lhunt     731: for (var i = 0; i &lt; lis.length; i++) {
1.21      lhunt     732:   process(lis.item(i));
                    733: }</pre>
                    734: 
1.108     lhunt     735:    <p>In ECMAScript, the language binding also allows <a
                    736:     href="#nodelist"><code>NodeList</code></a>s to be addressed using the
                    737:     array notation, so that loop could be rewritten like this:</p>
1.21      lhunt     738: 
1.24      lhunt     739:    <pre>for (var i = 0; i &lt; lis.length; i++) {
1.21      lhunt     740:   process(lis[i]);
                    741: }</pre>
                    742: 
1.108     lhunt     743:    <p>Since the <a href="#nodelist"><code>NodeList</code></a> objects
                    744:     returned by these methods are not live, changes to the DOM do not affect
                    745:     the content of the list. Consider the <code>process()</code> function
                    746:     called in the previous examples is defined as follows:</p>
1.21      lhunt     747: 
1.36      lhunt     748:    <pre>function process(elmt) {
1.21      lhunt     749:   elmt.parentNode.removeChild(elmt);
                    750: }</pre>
                    751: 
                    752:    <p>This would cause each selected element to be removed from the DOM, but
1.108     lhunt     753:     each element will remain in the <a
                    754:     href="#nodelist"><code>NodeList</code></a>. If the list were a live <a
                    755:     href="#nodelist"><code>NodeList</code></a>, removing an item from the DOM
                    756:     would also remove the element from the list and adjust the indexes of
                    757:     subsequent elements. That would have adverse effects upon the loop
                    758:     because not all selected elements would be processed.</p>
1.87      lhunt     759: 
                    760:    <p>In documents comprising elements from multiple namespaces, it's
                    761:     possible that some elements from different namespaces share the same
                    762:     local name. Since this API does not natively support a namespace
                    763:     resolution mechanism for selectors, obtaining a list of such elements
1.94      lhunt     764:     from a specific namespace, excluding all others, requires additional
1.87      lhunt     765:     processing to filter the result. The following example illustrates a
                    766:     document containing <code>video</code> elements from both the SVG and
                    767:     XHTML namespaces.</p>
                    768: 
                    769:    <pre>&lt;svg id=&quot;svg1&quot; xmlns=&quot;http://www.w3.org/2000/svg&quot;
                    770:                xmlns:xlink=&quot;http://www.w3.org/1999/xlink&quot;&gt;
                    771:   &lt;video id=&quot;svgvideo1&quot; xlink:href=&quot;myvideo.ogg&quot; width=&quot;320&quot; height=&quot;240&quot;/&gt;
                    772:   &lt;foreignObject width=&quot;100&quot; height=&quot;100&quot;&gt;
                    773:     &lt;video id=&quot;htmlvideo1&quot; src=&quot;myvideo.ogg&quot; xmlns=&quot;http://www.w3.org/1999/xhtml&quot;&gt;No video1&lt;/video&gt;
                    774:   &lt;/foreignObject&gt;
                    775: &lt;/svg&gt;</pre>
                    776: 
                    777:    <p>The following script demonstrates how to first select the
                    778:     <code>video</code> elements and then filter out the unwanted elements
                    779:     based on their namespace.</p>
                    780: 
1.106     lhunt     781:    <pre>var elms = document.querySelectorAll("svg video");
1.87      lhunt     782: var result = new Array();
                    783: var svgns = "http://www.w3.org/2000/svg"
                    784: 
                    785: for(var i = 0; i < elms.length; i++) {
1.107     lhunt     786:   if(elms[i].namespaceURI == svgns) {
1.87      lhunt     787:     result.push(elms[i]);
                    788:   }
                    789: }</pre>
1.21      lhunt     790:   </div>
                    791: 
1.11      avankest  792:   <h2 class=no-num id=references>References</h2>
1.1       avankest  793: 
1.54      lhunt     794:   <h3 class=no-num id=normative-references>Normative references</h3>
                    795:   <!--begin-normative-->
                    796:   <!-- Sorted by label -->
                    797: 
                    798:   <dl class=bibliography>
                    799:    <dt style="display: none"><!-- keeps the doc valid if the DL is empty -->
                    800:     <!---->
                    801: 
                    802:    <dt id=DOM-LEVEL-3-CORE>[DOM-LEVEL-3-CORE]
                    803: 
1.88      lhunt     804:    <dd>Gavin Nicol; et al. <a
1.54      lhunt     805:     href="http://www.w3.org/TR/2004/REC-DOM-Level-3-Core-20040407"><cite>Document
                    806:     Object Model (DOM) Level 3 Core Specification.</cite></a> 7 April 2004.
                    807:     W3C Recommendation. URL: <a
                    808:     href="http://www.w3.org/TR/2004/REC-DOM-Level-3-Core-20040407">http://www.w3.org/TR/2004/REC-DOM-Level-3-Core-20040407</a>
                    809:     </dd>
                    810:    <!---->
                    811: 
                    812:    <dt id=RFC2119>[RFC2119]
                    813: 
                    814:    <dd>S. Bradner. <a href="http://www.ietf.org/rfc/rfc2119.txt"><cite>Key
                    815:     words for use in RFCs to Indicate Requirement Levels.</cite></a> Internet
                    816:     RFC 2119. URL: <a
                    817:     href="http://www.ietf.org/rfc/rfc2119.txt">http://www.ietf.org/rfc/rfc2119.txt</a>
                    818:     </dd>
                    819:    <!---->
                    820: 
                    821:    <dt id=SELECT>[SELECT]
                    822: 
1.108     lhunt     823:    <dd>Tantek Çelik; et al. <a
1.107     lhunt     824:     href="http://www.w3.org/TR/2011/REC-css3-selectors-20110929/"><cite>Selectors
                    825:     Level 3.</cite></a> 29 September 2011. W3C Recommendation. URL: <a
                    826:     href="http://www.w3.org/TR/2011/REC-css3-selectors-20110929/">http://www.w3.org/TR/2011/REC-css3-selectors-20110929/</a>
1.54      lhunt     827:     </dd>
                    828:    <!---->
1.76      lhunt     829: 
                    830:    <dt id=WEBIDL>[WEBIDL]
                    831: 
                    832:    <dd>Cameron McCormack. <a
1.88      lhunt     833:     href="http://www.w3.org/TR/2008/WD-WebIDL-20081219"><cite>Web
                    834:     IDL.</cite></a> 19 December 2008. W3C Working Draft. (Work in progress.)
1.76      lhunt     835:     URL: <a
1.88      lhunt     836:     href="http://www.w3.org/TR/2008/WD-WebIDL-20081219">http://www.w3.org/TR/2008/WD-WebIDL-20081219</a>
1.76      lhunt     837:     </dd>
                    838:    <!---->
1.54      lhunt     839:   </dl>
                    840:   <!--end-normative-->
1.1       avankest  841: 
1.84      lhunt     842:   <h3 class=no-num id=informative-references>Informative references</h3>
1.54      lhunt     843:   <!--begin-informative-->
                    844:   <!-- Sorted by label -->
                    845: 
                    846:   <dl class=bibliography>
                    847:    <dt style="display: none"><!-- keeps the doc valid if the DL is empty -->
                    848:     <!---->
                    849: 
1.69      lhunt     850:    <dt id=CSS21>[CSS21]
                    851: 
                    852:    <dd>Bert Bos; et al. <a
1.107     lhunt     853:     href="http://www.w3.org/TR/2011/REC-CSS2-20110607"><cite>Cascading Style
1.108     lhunt     854:     Sheets Level 2 Revision 1 (CSS 2.1) Specification.</cite></a> 7 June
1.106     lhunt     855:     2011. W3C Recommendation. URL: <a
1.107     lhunt     856:     href="http://www.w3.org/TR/2011/REC-CSS2-20110607">http://www.w3.org/TR/2011/REC-CSS2-20110607</a>
1.69      lhunt     857:     </dd>
                    858:    <!---->
                    859: 
1.54      lhunt     860:    <dt id=DOM-LEVEL-2-STYLE>[DOM-LEVEL-2-STYLE]
                    861: 
1.108     lhunt     862:    <dd>Chris Wilson; Philippe Le Hégaret; Vidur Apparao. <a
1.54      lhunt     863:     href="http://www.w3.org/TR/2000/REC-DOM-Level-2-Style-20001113"><cite>Document
                    864:     Object Model (DOM) Level 2 Style Specification.</cite></a> 13 November
                    865:     2000. W3C Recommendation. URL: <a
                    866:     href="http://www.w3.org/TR/2000/REC-DOM-Level-2-Style-20001113">http://www.w3.org/TR/2000/REC-DOM-Level-2-Style-20001113</a>
                    867:     </dd>
                    868:    <!---->
                    869: 
                    870:    <dt id=ECMA-262>[ECMA-262]
                    871: 
                    872:    <dd><a
                    873:     href="http://www.ecma-international.org/publications/standards/Ecma-262.htm"><cite>ECMAScript
                    874:     Language Specification, Third Edition.</cite></a> December 1999. URL: <a
                    875:     href="http://www.ecma-international.org/publications/standards/Ecma-262.htm">http://www.ecma-international.org/publications/standards/Ecma-262.htm</a>
                    876:     </dd>
                    877:    <!---->
1.1       avankest  878:   </dl>
1.54      lhunt     879:   <!--end-informative-->
1.1       avankest  880: 
1.11      avankest  881:   <h2 class=no-num id=acknowledgements>Acknowledgements</h2>
1.1       avankest  882: 
1.45      avankest  883:   <p>The editors would like to thank to the following people who have
1.7       avankest  884:    contributed to this specification (ordered on first name):
                    885: 
1.84      lhunt     886:   <p>Adam van den Hoven, Alan Gresley, Alex Russell, Björn Höhrmann, Boris
                    887:    Zbarsky, Cameron McCormack, Charles McCathieNevile, Chris Wilson,
                    888:    Christophe Jolif, Daniel Glazman, Daniel Schierbeck, Dave Massy, David
                    889:    "liorean" Andersson, David Håsäther, Dean Jackson, Doug Schepers, Erik
1.104     lhunt     890:    Dahlström, Francois Remy, Hallvord R. M. Steen, Ian Hickson, Ivan
                    891:    Enderlin, Jean-Yves Bitterlich, Jim Ley, João Eiras, John Resig, Jon
                    892:    Ferraiolo, Jonas Sicking, Jorgen Horstink, Karl Dubost, Kartikaya Gupta,
                    893:    L. David Baron, Maciej Stachowiak, Magnus Kristiansen, Martijn, Masataka
                    894:    Yakura, Mihai Sucan, Mohamed Zergaoui, Nicholas C. Zakas, Nicolas Mendoza,
                    895:    Philip Taylor, Robert Sayre, Robin Berjon, Sander, Sergey Ilinsky, Simon
                    896:    Pieters, Steven Pemberton, Tarquin Wilton-Jones, Travis Leithead, and
                    897:    William J. Edney
1.1       avankest  898: 
                    899:   <p>Thanks to all those who have helped to improve this specification by
1.96      lhunt     900:    sending suggestions and corrections.

Webmaster