CSS selector: nth-child (even) Vs jQuery (": even")

jQuery selects first rowas even(based on 0), while CSS selects second rowas even(1 based). Yes, the jQuery documentation clearly mentions it as an extension, not part of the CSS in it. Additional note -

Since : it is even an extension of jQuery, and not part of the CSS specification, queries using: cannot even take advantage of the performance enhancement provided by the built-in DOM request of the SelectorAll () method. For best performance when using: even to select elements, first select the elements using a clean CSS selector, then use .filter (": even").

But shouldn't they be the same when deciding what is even and what is strange? Why confusion?

$('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>
Run codeHide result
+4
source share
1 answer

Even the documentation states that the behavior counter-intuitively, :even selects the first element, third element, and so on within the matched set.

, - ( ), "" " ". , , . :nth-child(even) CSS3, , jQuery 1.0 ( 2006, :even) .

, - jQuery, , , , , .

+3

All Articles