在jQuery中,我們經常會聽到“$(this).index()
”這個方法,它的作用是獲取當前元素在兄弟元素中的索引。這里簡單介紹一下這個方法的使用。
首先,$(this)
代表當前選中的元素。它可以是DOM對象、jQuery對象或任何選擇器所選中的元素。
// 用class為item的元素綁定點擊事件 $('.item').click(function(){ console.log($(this).index()); // 輸出當前元素在兄弟元素中的索引 });
在上面的代碼中,我們選中了class為item的元素,并綁定了它們的點擊事件。當某個item元素被點擊時,$(this)
就代表該元素,$(this).index()
就可以獲取到該元素在兄弟元素中的索引。
需要注意的是,index()
方法的索引是從0開始計數的,而不是從1開始。比如在下面的代碼中,第一個元素的索引是0,第二個元素的索引是1。
<ul> <li>item1</li> <li>item2</li> </ul>
而如果在多個元素中使用index()
方法,可以傳入一個參數來指定起始索引。比如下面代碼中,$(this)
是class為item的元素,$('ul').find('.item')
則是查找當前元素的兄弟元素中所有class為item的元素。
// 獲取當前元素在class為item的元素中的索引 $('.item').click(function(){ console.log($(this).index('.item')); });
在實際開發中,index()
方法經常和其他方法一起使用,比如eq()
方法。下面的代碼中,我們先獲取所有class為box的元素,然后使用eq()
方法獲取第一個元素,再使用index()
方法獲取第一個元素在class為box的元素中的索引。
// 獲取class為box的第一個元素在class為box的元素中的索引 var index = $('.box').eq(0).index('.box'); console.log(index);
總之,$(this).index()
是一個非常實用的方法,可以方便地獲取當前元素在兄弟元素中的位置,可以幫助我們更好地操作元素。