独角兽企业重金招聘Python工程师标准>>>
情况如下：
<!DOCTYPE html><html><head><meta charset="UTF-8"><title></title><script src="/jquery/2.0.0/jquery.min.js"></script><style>.btn,.btn_selected{ margin:30px; padding: 5px 10px; width: 200px; line-height: 24px; }.btn{ background: #fff; border: 1px solid darkred;}.btn_selected{ background: darkred; color: #fff;}</style><script type="text/javascript">$(function(){$(".btn").click(function(){$(this).removeClass("btn").addClass("btn_selected")})$(".btn_selected").click(function(){$(this).removeClass("btn_selected").addClass("btn")})})</script></head><body><div class="btn">11</div><div class="btn">22</div><div class="btn">33</div><div class="btn">44</div></body></html>
页面在初始化时，点击div.btn是可以改变自己的样式，结果F12调试查看，的确点击过后，该div的css名称已经切换成btn_selected的。
但是，此时，问题是：jquery，$(".btn_selected")这个对象却是获取不到了？？这样就没办法，再次点击后去掉已选择状态的css样式。
解决办法如下, 其他基本不变，主要改动在js部分。主要是在每次按钮单击后，做一个判断，再次检测。
<!DOCTYPE html><html><head><meta charset="UTF-8"><title></title><script src="/jquery/2.0.0/jquery.min.js"></script><style>.btn,.btn_selected{ margin:30px; padding: 5px 10px; width: 200px; line-height: 24px; }.btn{ background: #fff; border: 1px solid darkred;}.btn_selected{ background: darkred; color: #fff;}</style><script type="text/javascript">$(function(){var obj = $("div[tit='btn']")//var objNum = obj.length;//alert(objNum)obj.click(function(){//在每次单击前,做一个判断.是否含有匹配的css名称,if ($(this).hasClass("btn")){$(this).removeClass("btn").addClass("btn_selected")}else{$(this).removeClass("btn_selected").addClass("btn")}})})</script></head><body><div class="btn" tit="btn">11</div><div class="btn" tit="btn">22</div><div class="btn" tit="btn">33</div><div class="btn" tit="btn">44</div></body></html>
![[JQuery] jQuery选择器ID CLASS 标签获取对象值 属性 设置css样式](https://100zi.50zi.cn/uploadfile/img/14/820/b599fc51b932feea43beeae565a20332.jpg)
