Jquery：有人可以解釋一小段代碼，或給我一個很好的教程鏈接嗎？

Question

函數（索引）中調用的「索引」部分是什麼？事件處理程序？要麼？什麼？並可能有人向我解釋爲什麼我需要「功能（索引）」的「索引」，我不明白爲什麼它不會工作，如果我從「功能（索引）」刪除「索引」部分

$("h2").each( 
    function(index) { 
     $(this).css("z-index", index*2+2); 
    }); 

Answer 1

index是function的argument (parameter)。

您需要index將值傳遞給css()函數的值參數/參數。該索引與each()函數的每個「loop」一起遞增。

該代碼基本上移動元素「向前」的z-index ...更高索引z元素將呈現在較低索引z元素之上。這可能會用於爲頁面設置動畫效果，例如，您有一個div元素（例如）向前移動。

Answer 2

它看起來像它是逐步增加所有h2元素的z索引n * 2 + 2，這取決於它們在頁面中的順序位置。不確定這樣一段代碼的目的是什麼，但最終的結果將是每個後續的h2標籤具有更大的z-索引。

基於該代碼，等效串聯CSS將是：

<h2 style="z-index: 4" /> 
<h2 style="z-index: 6" /> 
<h2 style="z-index: 8" /> 
<h2 style="z-index: 10" /> 
<h2 style="z-index: 12" />  
... 

Answer 3

指數是一個整數，它的意思是當前對象的該數組中的索引。瞭解更多關於每個功能在http://api.jquery.com/each/
爲了便於理解，你有3個H2標籤

<h2>a</h2> 
<h2>b</h2> 
<h2>c</h2> 

然後用$('h2')，有2對象選擇匹配 當呼叫$('h2').each(function(index){}) =>

index := 0 for <h2>a</h2> 
index := 1 for <h2>a</h2> 
index := 2 for <h2>a</h2> 

Answer 4

此代碼通過使用each function from jQuery迭代頁面上的所有h2標記。

這些標記是通過使用作爲$函數的唯一參數傳遞的CSS selector來選擇的。這個函數還有另外一個名字 - jQuery - 如果你的代碼中有jQuery.noConflict();的地方，你會使用這個函數。

傳遞給此each函數的第一個參數本身就是另一個函數。這個匿名命名的函數將爲h2標籤集合的每個元素執行。此函數內的index參數是當前迭代的位置。此集合中的第一個元素將具有index的0，接下來的1和接下來的2等等。

在each，$(this)裏面的這個匿名函數中，再次使用$函數選擇當前迭代的元素。當css在$(this)上被調用時，它將一個特定的CSS屬性（第一個參數）設置爲z-index，作爲第二個參數傳入的值。

---

我希望這足夠詳細，以解釋發生了什麼。

Answer 5

每個對集合中的每個元素調用給定的函數 - 在這種情況下，每個元素都會調用<h2>元素。函數的索引參數是集合中當前元素的索引 - 將針對索引爲0的第一個<h2>以及索引爲1的第二個<h2>調用該函數，依此類推。所以這段代碼給了第一個z-index爲2，第二個爲z-index 4，第三個爲z-index 6，依此類推。

參見http://api.jquery.com/each/

Answer 6

指數是所有H2標籤的陣列中的位置。

因爲.each（）遍歷所有h2標籤，所以在DOM中第一個h2的索引爲0，第二個h2的索引爲1，依此類推。