为了扩展jQuery库函数,jQuery提供了两种方式:
1.jQuery.extend(object):扩展jQuery对象本身,主要是用来扩展jQuery全局函数 ,调用时直接$.函数名(参数),例:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="js/jquery-3.3.1.min.js" ></script>
</head>
<script>
$.extend({
min:function(a,b){
return a<b? a : b;
},
max:function(a,b){
return a>b? a : b;
}
})
var min = $.min(1,2);
console.log(min);
</script>
</html>
结果为:1
2.jQuery.fn.extend(object):扩展 jQuery 元素集,主要用于扩展jQuery插件,调用时需要用jQuery对象调用相应的函数,例:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="js/jquery-3.3.1.min.js" ></script>
</head>
<body>
<input type="checkbox" name="hobby" value="1" checked="checked"/>足球
<input type="checkbox" name="hobby" value="2"/>篮球
<input type="checkbox" name="hobby" value="3" checked="checked"/>乒乓球
</body>
<script>
$.fn.extend({
values:function(){
var result = "";
this.each(function(){//此this为jQuery对象
if(this.checked){//此this为Dom对象
result = result+","+this.value;
}
});
return result.substring(1);
}
})
var result = $("[name='hobby']").values();
console.log(result);
</script>
</html>
结果为:1,3