jquery - CSS 选择器 :nth-child(even) Vs jQuery( ":even" )

Question

jQuery 选择 first row 作为 even (基于 0)而 CSS 选择 second row 作为 even (1基于)。是的，jQuery documentation在它的附加说明中明确提到它是一个扩展而不是 CSS 的一部分 -

Because :even is a jQuery extension and not part of the CSS specification, queries using :even cannot take advantage of the performance boost provided by the native DOM querySelectorAll() method. To achieve the best performance when using :even to select elements, first select the elements using a pure CSS selector, then use .filter(":even").

但在决定什么是偶数和什么是奇数时，它们不应该是一样的吗？为什么会混淆？

$('ul li').filter(':even').text('jQuery Even')

li {
  color: blue;
}
li:nth-child(even) {
  color: red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<ul>
  <li>CSS Odd</li>
  <li>CSS Even</li>
  <li>CSS Odd</li>
  <li>CSS Even</li>
  <li>CSS Even</li>
</ul>

Answer 1

即使在文档中，也指出行为违反直觉，:even 选择匹配集中的第一个元素、第三个元素等等。

因为我认为这种行为没有任何技术原因(除了索引是偶数)，所以它实际上更像是一个“为什么”问题，即“为什么要这样设计”。也许对于创建它的人来说更容易或更直观。 :nth-child(even) 是 CSS3 选择器模块规范的一部分，目前是 Recommendation但在 jQuery 1.0 的时候(在 2006 年 :even 被引入时)仍然是一个候选推荐。

至于为什么它仍然是 jQuery 中的行为，这可能是为了反向兼容，因为修改行为可能会破坏所有依赖于遗留行为的现有站点和代码。