很多情况下,用户需要对jQuery插件进行二次开发,那么我们来看看JQ原开发者为我们提供的两种扩展插件的方式如下:
1.类别类：
相当于为jquery扩展一个类,比如现在我要扩展一个简单的想加的功能函数sum,如下:
之后我们可以直接用:
1 $.extend({ 2 sum:function(){ 3 var num=0; 4 for(var i=0;i<arguments.length;i++){ 5 num+=arguments[i]; 6 } 7 return num; 8 } 9 }) 10 console.log($.sum(12,3))
2.对象级别：
相当于扩展一个对象,即为jQuery.fn.extend(object):增加两个插件方法：如下
1 jQuery.fn.extend({ 2 check: function() { 3 return this.each(function() { this.checked = true; }); 4 }, 5 uncheck: function() { 6 return this.each(function() { this.checked = false; }); 7 } 8 }); 9 10 $("input[type=checkbox]").check(); 11 $("input[type=radio]").uncheck();
自己想要批量移除一个元素身上的属性，百度了一下没有找到，就自己用jq提供的拓展方法写了一个，具体代码如下：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>批量移除元素身上的属性</title> 6 </head> 7 <body> 8 <div id="box" flag="true" status="ok" bac="11"></div> 9 </body> 10 <script src="https://cdn.bootcss.com/jquery/2.2.4/jquery.min.js"></script> 11 <script> 12 jQuery.fn.extend({ 13 batchRemove:function(arr){ 14 for(var i=0;i<arr.length; i++){ 15 $(this).removeAttr(arr[i]); 16 } 17 } 18 }) 19 $('#box').batchRemove(['flag','bac']) 20 </script> 21 </html>