jquery部分方法補充

簡單介紹一下今天所學的部分jquery方法。jquery方法命名比較語義化,理解起來比較簡單,所有有些方法還是需要自己去探索的。

1.eq()方法

我們常用$()函數來返回一個對象隊列,此時可以用eq方法來精確選擇這個序列中的某個元素。eq方法的參數是從0開始的整數,跟數組的下標很像。

$("p").eq(3) //這樣就是選擇了第4個p標簽。

同樣的,lt、gt、odd、even、first、last都是這個機理。不過這些需要寫在$()里面,如$("p:lt(3)")就是選擇了下標小于3的前三個p標簽。

2.index()方法

如果不傳遞任何參數給 .index() 方法,則返回值就是jQuery對象中第一個元素相對于它同輩元素的位置。
如果在一組元素上調用 .index() ,并且參數是一個DOM元素或jQuery對象, .index() 返回值就是傳入的元素相對于原先集合的位置。
如果參數是一個選擇器, .index() 返回值就是原先元素相對于選擇器匹配元素的位置。如果找不到匹配的元素,則 .index() 返回 -1.
index()方法常跟$(this)合用。
舉個例子。

$("div").click(function(){
    alert($(this).index());
}) //這里就是輸出此div在所有div中的排名。

3.each()方法

each()表示遍歷節點,也叫作迭代符合條件的節點。和for循環的遍歷一個道理。這個還是比較常用的。

$("p").each(function(i){
    $(this).animate({"width":50 * i},1000);
});

上面的例子就是將所有p標簽遍歷,使每個p標簽的寬度與自己的下標掛上鉤。

4.get()方法

get()方法和eq()方法基本一致,都仰賴$()的序列。
不過,eq()返回的是jQuery對象,而get()返回的是原生JS對象。jQuery對象后面要跟著jQuery方法,原生對象后面要跟著原生屬性、方法。

$("p").eq(2).html("哈哈哈哈哈哈");
$("p").get(2).innerHTML = "哈哈哈哈哈哈";
//上面兩行代碼是等價的

其他介紹:
動畫相關:show()顯示、hide()隱藏、toggle()切換
額外內容比較簡單,具體介紹可以參考https://github.com/lvye1221/Web1708/blob/master/F03-%E7%BB%84%E4%BB%B6-JQuery-%E5%8A%A8%E7%94%BB%E4%B8%8E%E8%8A%82%E7%82%B9/jQuery%E7%AC%AC2%E5%A4%A9%E8%AF%BE%E5%A0%82%E7%AC%94%E8%AE%B0.docx

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容