サマリー：jQuery自定義插件jQuery是一個功能強大的庫，提供了開發(fā)JavaScript項目所需的所有核心函數(shù)。然而，有時候我們還是需要使用自定義代碼來擴展這些核心函數(shù)來提高開發(fā)效率。 jQuery庫是為了加快JavaScript的開發(fā)速度而設(shè)計的，通過簡化編寫JavaScript的方式，減少代碼量。jQuery編寫插件有兩種方式 1.添加jQuery對象級別的插件，原理是給jQu
jQuery自定義插件
jQuery是一個功能強大的庫，提供了開發(fā)JavaScript項目所需的所有核心函數(shù)。然而，有時候我們還是需要使用自定義代碼來擴展這些核心函數(shù)來提高開發(fā)效率。
jQuery庫是為了加快JavaScript的開發(fā)速度而設(shè)計的，通過簡化編寫JavaScript的方式，減少代碼量。
jQuery編寫插件有兩種方式
1.添加jQuery對象級別的插件，原理是給jQuery類添加方法。
寫法如下：
(function($){
$.fn.extend({
函數(shù)名:function(自定義參數(shù)){
//自定義插件代碼部分
}
});
})(jQuery);
//第二種寫法
(function($){
$.fn.函數(shù)名=function(自定義參數(shù)){
//自定義插件代碼
}
})(jQuery);
//調(diào)用方法
("#id").函數(shù)名(參數(shù));2.添加jQuery類級別的方法，也就是添加靜態(tài)方法
寫法如下：
(function($){
$.extend({
函數(shù)名:function(自定義參數(shù)){
//自定義插件代碼
}
});
})(jQuery);
//第二種寫法
(function($){
$.函數(shù)名=function(自定義參數(shù)){
//自定義插件代碼
}
})(jQuery);
//調(diào)用方式
$.函數(shù)名(參數(shù));jQuery插件的種類
1.對象級別插件開發(fā)，即給jQuery對象添加方法，封裝對象方法的插件，例如：append()、val()。
2.類級別插件開發(fā)，即給jQuery添加全局函數(shù)，相當(dāng)于給類本身添加方法，例如：$.ajax();
jQuery的插件機制
jQuery為開發(fā)插件提供了兩種方法。
1. jQuery.fn.extend(object)，給jQuery對象添加方法。
2. jQuery.extend(object)，給jQuery類添加方法。
這兩個方法接收的參數(shù)都是一個對象，類型為Object，Object里面的”名/值”分別對應(yīng)”函數(shù)名/函數(shù)主體”。
fn是什么
查看jQuery源碼：
<span style="font-size:12px;">jQuery.fn = jQuery.prototype = { init: function( SELECTor, context ) {//.... //...... }; </span>從源碼中查看，可以得出：
jQuery.fn=jQuery.prototype //fn指向jQuery對象的原型，即為jQuery類添加成員函數(shù)。
這里我寫一個簡單的例子來實現(xiàn)一個最簡單的插件，僅僅是用來說明一下如何使用jQuery開發(fā)插件。
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>自定義jQuery插件</title>
<script src="plugs/jquery-2.2.3.min.js"></script>
<script>
//這是一個自定義的jQuery插件
(function(){
$.fn.extend({
myFirst:function(){
var s="This is my first jQuery";
$(this).append(s);
}
});
})(jQuery);
</script>
</head>
<body>
<div id="i1"></div>
<script>
$("#i1").myFirst();
</script>
</body>
</html>執(zhí)行以后返回的頁面為：
更多關(guān)于jQuery自定義插件詳解及實例代碼請關(guān)注PHP中文網(wǎng)（m.miracleart.cn）其他文章！