简介
jquery类级别的插件开发,我们可以自定义一些类级别的方法,开发时候使用
正文
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script src="js/jquery-3.6.3-min.js"></script>
<script src="js/jquery-math.js"></script>
<script src="js/index.js"></script>
<script src="js/jquery-color.js"></script>
</head>
<body>
jquery插件:<br />
<input type="button" id="btn" value="对象级别的插件开发" />
<input type="button" id="btn2" value="测试jquery类级别的插件开发"/>
<div id="d1" style="color: red;">
颜色改成红色
</div>
</body>
</html>
jquery-math.js
//针对类级别的插件开发
jQuery.extend({
"max":function(a,b){
return a>b?a:b;
},
"min":function(a,b){
return a>b?b:a;
}
})
index.js
$(function(){
$("#btn").click(function(){
alert($("#d1").color());
//$("#d1").css("color","red");
//document.getElementById("d1").style.color="red";
})
$("#btn2").click(function(){
alert($.max(3,6));
alert($.min(3,6));
})
})
function test(){
document.getElementById("d1").style.color="red";
}
项目结构
运行代码