CSS選擇器：nth-child（偶數）vs jQuery（「：even」）

jQuery選擇first row作爲even（0 based），而CSS選擇second row作爲even（1 based）。是，jQuery的documentation明確提到它在它的CSS的延伸，而不是部分的補充說明 -CSS選擇器：nth-child（偶數）vs jQuery（「：even」）

因爲：即使是一個jQuery的擴展，而不是CSS的一部分 規範，使用查詢：即使不能利用本機DOM querySelectorAll（）方法提供的性能提升。要在使用時達到最佳性能：即使選擇元素，首先使用純CSS選擇器選擇元素，然後使用.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>

來源

2014-10-22 Niranjan Borawake

您已經確定了這種差異：基於零的計數和基於一次的計數。爲了使它們匹配，只需使用CSS的'：nth-child（偶數）'作爲jQuery選擇器。 – 2014-10-22 07:40:13

@DavidThomas感謝您的回覆。你有任何參考資料可以說明保持這種差異的原因。 – 2014-10-22 07:43:47

即使在文檔中，它指出，行爲counter-intuitively, :even selects the first element, third element, and so on within the matched set.

由於我不認爲有這方面的任何技術原因（比指標是偶數除外）行爲，它更像是「爲什麼」這個問題。也許創建它的人更容易或更直觀。 :nth-child(even)是CSS3選擇器模塊規範的一部分，該規範目前爲Recommendation，但在jQuery 1.0時（2006年，當引入:even時）仍然是候選推薦標準。

至於爲什麼它仍然是jQuery的行爲，這可能是反向兼容的，因爲修改行爲可能會破壞所有依賴遺留行爲的現有網站和代碼。

來源

2014-10-22 07:43:26 arcyqwerty

CSS選擇器：nth-​​child（偶數）vs jQuery（「：even」）

回答

相關問題

CSS選擇器：nth-child（偶數）vs jQuery（「：even」）