自定義jquery外掛擴充套件
阿新 • • 發佈:2018-12-26
根據我們的需要有時候會擴充套件$例項方法,eg: $("#id").customFunction
總體結構
(function($) {
$.fn.extend({
customFunction: function(options) {
...// 自定義方法,比方複雜的則需提出去單獨寫,再此引用比較優雅
}
});
})(jQuery);
eg : 擴充套件jquery例項的parentName, 獲取父節點的name
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"> <title>Title</title> <link rel="stylesheet" href="index.css" > <script src="jquery-3.2.1.js"></script> <script src="getParentName.js"></script> </head> <body> <div name = "this is parent"> <divid="child" name ="this is child"> </div> </div> <span id="data"></span> </body> <script> $("#data").text($("#child").getParentName()); </script> </html>
getParentName.js
(function($) { $.fn.extend({ getParentName: function() { return this結果: 頁面展示 this is parent.parent().attr("name"); } }); })(jQuery);