我很感激,如果有人也指出我的理论来源,那么我可以更好地把握它.
假设我有以下HTML：
<ul> <li>1</li> </ul> <ul> <li>2</li> </ul>
这个JavaScript代码：
alert($("ul li:eq(0)").length);
alert($("ul").find("li:eq(0)").length);
alert($("ul").find("li").eq(0).length);
我得到1,2,1作为输出.我能理解为什么我在最后一个案例中得到1,但为什么JavaScript代码的第1行和第2行给出了不同的输出.
解决方法
eq是一个奇怪的jQuery选择器,与大多数选择器的基于CSS的逻辑并不完全一致(在此
documentation提取中强调我的)：
The index-related selectors (:eq(),:lt(),:gt(),:even,:odd) filter the set of elements that have matched the expressions that precede them
简而言之,第一种情况中的eq(0)适用于整个ul li.
$(“anything：eq(0)”)最多只能返回一个元素.
而在第二种情况下,“li：eq(0)”选择器通过find应用于$(“ul”)的所有匹配.
