W3C home > Mailing lists > Public > whatwg@whatwg.org > October 2011

[whatwg] Selector API

From: Bronislav Klučka <Bronislav.Klucka@bauglir.com>
Date: Mon, 17 Oct 2011 22:06:19 +0200
Message-ID: <4E9C8ABB.1030409@bauglir.com>
Hello,
at this point Selector API is missing certain functionality: to target 
child nodes.
Consider following fragment:
<ul class="list">
<li>node 1
<ul>
<li>node 1.1</li>
<li>node 1.2</li>
</ul>
</li>
<li>node 2
<ul>
<li>node 2.1</li>
<li>node 2.2</li>
</ul>
</li>
</ul>
targeting node 1 and node 2 in CSS is easy:
.list > li
selector API against document as well
document.querySelectorAll(".list > li");

but let's say there are multiple ul.list element on the page and e.g. 
via click event I got reference to one of those list
myListVariable.querySelectorAll(" > li");
does not work... selector is missing parent reference

of course the same goes for + and ~ combinators

sure UL children are always LI, one could simply traverse through child 
nodes, but there can be other user cases (searching for all section.box 
that are children of section#mainContent having all kinds of sections, 
navs, headers, footers, paragraphs...)

Would it be possible to either
1/ accept combinators without left hand reference assuming that matches 
the element (or body in case of document.querySelector[All])
e.g. myListVariable.querySelectorAll(" > li");

2/ have Element object exposing selector property that would uniquely 
identify such element in document (like "body > section:nth-child(5) > 
article:nth-child(3) > p:first-child") which could be used as reference
e.g. myListVariable.querySelectorAll(myListVariable.selector + " > li");

?

Bronislav Klucka
Received on Monday, 17 October 2011 13:06:19 UTC

This archive was generated by hypermail 2.4.0 : Wednesday, 22 January 2020 16:59:37 UTC