Re: nth descendent selector

Brian Kardell :: @bkardell :: hitchjs.com
On Nov 9, 2012 3:16 PM, "Lea Verou" <lea@w3.org> wrote:
>
> Sounds like this would be solved by the :nth-match() pseudo-class [1] in
Selectors 4. Specifically, the selector in your example would be
li:nth-match(7 of li) or just :nth-match(7 of li).
>
> [1]: http://www.w3.org/TR/selectors4/#the-nth-match-pseudo
>
> Lea Verou
> W3C developer relations
> http://w3.org/people/all#lea ✿ http://lea.verou.me ✿ @leaverou
>
>
>
>
>

That would answer the use case given, but caution though it is also a
sibling combinator and not an equivalent of the js he provided.

>
> On Nov 9, 2012, at 12:33, Dave Smith wrote:
>
>> Hi
>>
>>
>> The :nth-of-type and similar selectors are really great but is there
reason why we don't have a selector equivalent to
document.getElementsByTagName?
>>
>>
>> A selector like ":nth" that would only ever select zero or one element
in comparison to :nth-of-type or similar which can select zero or more
elements.
>>
>>
>> For example
>> li:nth(7)
>> would be equivalent to document.getElementsByTagName('li')[6]
>>
>>
>> I for one would find this useful in making my CSS more robust and easier
to write, for example take this very rough and contrived scenario:
>>
>>
>> Document 1:
>> <h1></h1>
>> <h1></h1>
>>
>>
>> Document 2:
>> <p></p>
>> <div><h1></h1></div>
>> <h1></h1>
>>
>>
>> Document 3:
>> <div> <div> <h1></h1> </div> </div>
>> <h1></h1>
>>
>>
>> In this example I want to ensure that the first h1 always has less of a
margin above it (or conversely I want to ensure that any subsequent h1s
have more of a margin above them) and importantly I have no control over
the markup I'm receiving.
>>
>>
>> There may be are other use-cases for a selector equivalent to
document.getElementsByTagName.
>>
>>
>> all the best
>> Dave
>
>