Opened 15 years ago
Closed 15 years ago
#3132 closed bug (invalid)
in the :nth-child selector
Reported by: | guest | Owned by: | |
---|---|---|---|
Priority: | major | Milestone: | 1.3 |
Component: | selector | Version: | 1.2.6 |
Keywords: | Cc: | ||
Blocked by: | Blocking: |
Description
use html file in attachment
and write in firebug console
>>> $('.menu li').size() 7 >>> $('.menu li:nth-child(5)').size() 1 >>> $('.menu li:nth-child(5)') [li#li5] >>> $('.menu li:nth-child(2)') [li#li2] >>> $('.menu li:nth-child(2n)') [li#li2, li#li4, li#li6] >>> $('div') [div#div1, div#div2, div#div3, div#div4, div#div5, div#div6, div#div7, div#div8, div#div9, div#div10] >>> $('div').size() 10 >>> $('div:nth-child(3)') [div#div3, div#div6] >>> $('div:nth-child(3n)') [div#div3, div#div6, div#div9] #correct >>> $('div:nth-child(5)') [div#div8] #wrong, needed #div5 >>> $('div:nth-child(2)') [div#div1, div#div5] #wrong, needed #div2 >>> $('div:nth-child(1)') [div#div2, div#div4] #wrong, needed #div1 >>> $('div:nth-child(2n)') [div#div1, div#div5, div#div7, div#div9] #wrong, neeeded #div2 #div4 #div6 #div8 #div10 >>> $('div:nth-child(n)') [div#div1, div#div2, div#div3, div#div4, div#div5, div#div6, div#div7, div#div8, div#div9, div#div10] #correct
the implementation of ":nth-child" selector works fine on li elements, but gives the wrong results on div elements. the bug?
Attachments (1)
Change History (7)
Changed 15 years ago by
comment:1 Changed 15 years ago by
comment:2 Changed 15 years ago by
no i`m wrong
>>> $('div div:nth-child(2)') [div#div5]
correct div4 is the second child
>>> $('div div:nth-child(2n)') [div#div5]
correct div4 and div6 are the second and fourth
comment:4 Changed 15 years ago by
No, I don`t think so, the problem was not solved. I try to experiment with child ul-li-ul-li and div-div-div elements. And the problem is that for example "div:nth-child(1)" matches to each first div in the parent div( and so on), but need to match the first div in flat list of divs.
problem not only with tree of tags. For example, If i mark div1, div5, div8 with class="marked". and try to get one of the "div.marked", the result was wrong. $('div.marked:nth-child(1)') returns nothing, but must div1 $('div.marked:nth-child(2)') returns [div1,div5], but must only div5 $('div.marked:nth-child(3)') returns nothing, but must div8 $('div.marked:nth-child(5)') returns div8, but must nothing.
my first guess-work that jquery count nth-child not from matched elements, but from the child index of the parent element. In the example above div8 is the 5 child in the body element.
sorry for my english, if you wish I try to describe this problem more exactly, and write the tests.
comment:5 Changed 15 years ago by
Hm, i read documentation http://www.w3.org/TR/css3-selectors/ more thoroughly. And i think that i make a mistake. To match one of the div i must use :nth-of-type pseudo-class. But juery seems to not support :nth-of-type. So sorry for the noise, and please close the ticket.
P.S. while googling i found that jquery support :eq pseudo-class which is exactly that i need.
P.S. Should i create enhancement ticket about supporting :nth-of-type in jquery?
comment:6 Changed 15 years ago by
Resolution: | → invalid |
---|---|
Status: | new → closed |
That's what I was about to say, nth-child isn't relative to the collection, but to the actual siblings.
You can create a ticket for that if you want.
I'll close now.
and more tests