AI智能
改变未来

jQuery封装的各种方法


封装width

KaTeX parse error: Expected \’}\’, got \’EOF\’ at end of input: …);//this是.fn,是一个jQuery对象,经过parseFloat转换后的,即使是带px单位,也会被筛掉,只剩下浮点数字,此时w是一个数值,此时如果w依然是非数字,则证明传进来的参数是一个非数字,则跳出即可。
w=parseFloat(w)
if(isNaN(w)) return;
this.css({
width:w+“px” //特别说明:这里的+\”px\”可加可不加,因为在jQuery中数字的单位会自动补充。
})
}
$(“div”).widths(200);

封装backgroundColor

$.fn.bgc=function(color){if(color===undefined) return this.css(\"backgroundColor\");this.css(\"backgroundColor\",color);return this;}

$.extend

$.extend({a:function(){console.log(\"aa\");}})

想要调用extend中的a函数方法:$.a();

利用extend重构jQuery遍历each

$.extend({eachs:function(list,fn){switch(list.constructor){case Array:case jQuery:case HTMLCollection:case NodeList:for(var i=0;i<list.length;i++){fn(i,list[i]);}break;case Object:for(var prop in list){fn(prop,list[prop]);}break;case Set:for(var value of list){fn(value,value);}break;case Map:for(var value of list){fn(value[0],value[1]);}break;}}})

数组遍历

var arr=[\"a\",\"b\",\"c\",\"d\",\"e\"];$.eachs(arr,function(index,item){console.log(index,item);})

jQuery对象遍历

$.eachs($(\"div\"),function(index,item){console.log(index,item);})

对象遍历

var obj={a:1,b:2,c:3};$.eachs(obj,function(key,item){console.log(key,item);})

set

var set=new Set([1,2,3,4,5,6]);$.eachs(set,function(key,item){console.log(key,item);})

map

var map=new Map();map.set(\"name\",\"xietian\");map.set(\"age\",30);map.set(\"sex\",\"男\");$.eachs(map,function(key,item){console.log(key,item);})
赞(0) 打赏
未经允许不得转载:爱站程序员基地 » jQuery封装的各种方法