jQuery插件机制

最新推荐文章于 2020-07-31 12:48:28 发布

Zzze0101

最新推荐文章于 2020-07-31 12:48:28 发布

阅读量154

点赞数

分类专栏： jQuery 文章标签： jQuery

本文链接：https://blog.csdn.net/Zzze0101/article/details/90719805

版权

jQuery 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

扩展jQuery库函数第一种方式：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript" src="js/jquery-1.8.3.js" ></script>
	</head>
	<body>
		<script>
			jQuery.extend({
				max:function(a,b){
					return a>b?a:b;
				},
				min:function(a,b){
					return a>b?b:a;
				}
			});
			console.log("最大值："+$.max(1,3));
			console.log("最小值："+$.min(1,3));
		</script>
	</body>
</html>

在浏览器的控制台中查看执行结果：
在这里插入图片描述
扩展jQuery库函数第二种方式：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript" src="js/jquery-1.8.3.js" ></script>
	</head>
	<body>
		<input type="checkbox" name="selectAll" />全选
		<input type="checkbox" name="hobby" value="0" />足球
		<input type="checkbox" name="hobby" value="1" />篮球
		<input type="checkbox" name="hobby" value="2" />乒乓球
		<script>
			jQuery.fn.extend({
				check:function(){
					this.attr("checked","checked");
				},
				uncheck:function(){
					this.removeAttr("checked");
				}
			});
			$("[name='selectAll']").click(function(){
				$("[type='checkbox']").check();
			})
		</script>
	</body>
</html>

上述代码简单实现了全选功能：
在这里插入图片描述

Zzze0101

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
jQuery插件机制

扩展jQuery库函数第一种方式：<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript" src="js/jquery-1.8.3.js" ></sc...
复制链接

扫一扫

专栏目录