jQuery常用方法以及實例總結——需要記憶

我們都知道，程序員如果一直重複同樣的工作，在很多地方都會用到重複的代碼，就會想是不是可以把一些共同的代碼單獨提取出來，經過進一步的改造，讓它可以放之四海而皆準，去解決絕大部分的重複代碼編寫工作。可以轉換一下思維，jquery就是用JS寫的，方便編程的一個方法集合。還可以這樣通俗的理解，js是語言，JQuery是建立在這個語言上的一個基本庫，利用可以更簡單的使用js。這分別就像是木頭和做好的木板，木頭是基本的原材料，利用木頭你可以做各種傢具。但是利用做好的木板你可以更簡單的做各種傢具。今天就讓我來為大家具體介紹一下jQuery常用方法總結，並且都是基礎性的，需要記憶性的東西，只有熟知才能運用到相關的開發問題上。

1.each()：遍歷函數

用法：它是一個通用的迭代函數，可以用來無縫迭代對象和數組。jQuery.each(collection,callback(indexInArray,valueOfElement))

實例：

$("button").click(function(){

$("li").each(function(){

alert($(this).text())

});

})；

2.data()：存儲數據

用法：存儲任意數據到指定的元素並且/或者返回設置的值，jQuery.data(element,key,value)。

屬性：element:Element要關聯數據的DOM對象；key:String存儲的數據名；value:Object新數據值

實例：$.data(document.body,"foo",52);console.log($.data(document.body,"foo"));//52

3.type()：檢查類型

用法：type()方法用於檢測javascript對象的類型如果對象是undefined或null，則返回相應的「undefined」或「null」

4.append()：插入節點

用法：使用append(content[,content])方法在每個匹配元素裡面的末尾處插入參數內容，參數可以是DOM元素，DOM元素數組，HTML字元串，或者jQuery對象

實例：

$("#btn").click(function(){

$("#box").append("測試內容");

$(".inner").append($("#box"));

})

5.remove()：刪除節點

用法：remove()方法會將元素自身移除，同時也移除元素內部的一切，包括綁定事件及與該元素相關的jQuery數據

實例：

$("#btn1").click(function(){

$div=$(".inner").remove();

})

jQuery常用方法總結（需要記憶）

6.replaceWith()：替換節點

用法：replaceWith()方法用提供的內容替換集合中所有匹配的元素並且返回被刪除元素的集合

實例：

$("#btn").click(function(){

alert($(".inner").replaceWith("

div

").html())

})

7.attr(attributeName)：增加和獲取屬性

用法：attr(傳入特性名)：獲取特性的值，相當於DOM中的getAttribute()，這個方法既可以設置屬性也可以取出某個屬性。

實例：

取出屬性：console.log($("#test").attr("id"));

增加屬性：$("#test").attr("title","123");

8.removeAttr(attributeName)：刪除屬性

用法：removeAttr()方法使用原生的removeAttribute()函數，但是它的優點是可以直接在一個jQuery對象上調用該方法。

實例：$("#ele1").removeAttr("titledata");

9.find()：獲取後代元素

用法：find()方法通過一個選擇器，jQuery對象，或元素過濾，得到當前匹配的元素集合中每個元素的後代，匹配的元素將構造一個新的jQuery對象

10.Extend()方法

用法：這個方法運用有點難度：jquery的擴展方法extend是我們在寫插件的過程中常用的方法，該方法有一些重載原型。

extend(dest,src1,src2,src3...);它的含義是將src1,src2,src3...合併到dest中,返回值為合併後的dest,由此可以看出該方法合併後，是修改了dest的結構的。如果想要得到合併的結果卻又不想修改dest的結構，可以如下使用：

varnewSrc=$.extend({},src1,src2,src3...)//也就是將"{}"作為dest參數。這樣就可以將src1,src2,src3...進行合併，然後將合併結果返回給newSrc了。

實例：

varresult=$.extend({},,那麼合併後的結果result=也就是說後面的參數如果和前面的參數存在相同的名稱，那麼後面的會覆蓋前面的參數值。

以上就是關於jQuery常用方法總結的十點方法以及實例的詳細說明，感興趣的朋友可以關注我哦！我們可以分享不一樣的知識點，共同進步！

喜歡這篇文章嗎？立刻分享出去讓更多人知道吧！