1.挂事件：
运用JQuery，当点击挂事件时给div加上一个点击事件，当点击移除事件按钮时则取消掉这个div上的点击事件。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><script src="jquery-1.11.2.min.js"></script></head><body><div id="aa"></div><input type="button" value="挂事件" id="gua" /><input type="button" value="移除事件" id="yichu" /></body><script type="text/javascript">$("#aa").css("width","100px");$("#aa").css("height","100px");$("#aa").css("background-color","red");$("#gua").click(function(){ ???$("#aa").bind("click",function(){ ???????alert("div被点击了"); ???})})$("#yichu").click(function(){ ???$("#aa").unbind("click")})</script></html>2.运用JQuery，做全选，进行批量操作：
<body><h1>全选效果</h1><div><input type="checkbox" value="qx" id="qx" /> 全选</div><br /><div><input type="checkbox" value="1" class="ck" /> 潘庄<input type="checkbox" value="1" class="ck" /> 火炬公园<input type="checkbox" value="1" class="ck" /> 理工大<input type="checkbox" value="1" class="ck" /> 马尚<input type="checkbox" value="1" class="ck" /> 沣水<input type="checkbox" value="1" class="ck" /> 南定</div></body><script type="text/javascript">$("#qx").click(function(){ ???????????????//找到全选按钮的选中状态 ???????//var xz = $(this)[0].checked; //这是用js方法写的。 ???????var xz = $(this).prop("checked"); ???????//单独用jquery写就用这种方式 ???????????????//改变所有的checkbox选中状态 ???????$(".ck").prop("checked",xz); ???????????})</script></html>3.当点击某一个div的时候所有div都变成红色，点的那个div变成绿色。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><script src="jquery-1.11.2.min.js"></script></head><style> ???.d{ ???????width: 150px; ???????height: 150px; ???????background-color: red; ???????margin: 5px; ???????float: left; ???}</style><body><div class="d"></div><div class="d"></div><div class="d"></div><div class="d"></div><div class="d"></div><div class="d"></div><div class="d"></div><div class="d"></div><div class="d"></div><div class="d"></div><div class="d"></div><div class="d"></div><div class="d"></div><div class="d"></div><div class="d"></div><div class="d"></div></body><script type="text/javascript"> ???????//1.当点击某一个div的时候所有div都变成红色 ???//2.点的那个div变成绿色 ???????$(".d").click(function(){ ???????$(".d").css("background-color","red"); ???????????????$(this).css("background-color","green"); ???})
</script></html>JQuery的基础学习
原文地址：https://www.cnblogs.com/shandayuan/p/8469717.html