<html lang="en" xmlns="http://www.w3.org/1999/xhtml"> <head> <meta charset="utf-8" /> <title>look you sisther</title> <style type="text/css"> .current { background-color:red; } </style> <script type="text/javascript" src="jquery-1.9.1.js"></script> </head> <body> <div class="box"> <ul class="menu"> <li class="level1"> <a href="#">寸衫</a> <ul class="level2"> <li><a href="#">A</a></li> <li><a href="#">B</a></li> <li><a href="#">C</a></li> <li><a href="#">D</a></li> </ul> </li> <li class="level1"> <a href="#">裤子</a> <ul class="level2"> <li><a href="#">A</a></li> <li><a href="#">B</a></li> <li><a href="#">C</a></li> <li><a href="#">D</a></li> </ul> </li> <li class="level1"> <a href="#">鞋子</a> <ul class="level2"> <li><a href="#">A</a></li> <li><a href="#">B</a></li> <li><a href="#">C</a></li> <li><a href="#">D</a></li> </ul> </li> </ul> </div> </body> </html> <script type="text/javascript"> $(document).ready(function () { $(".level1>a").click(function () { $(this).addClass("current").next().show().parent().siblings().children("a").removeClass("current").next().hide(); // a标签添加一个属性 关联的下一个元出现 并且其父元素的全部同胞元素(li)的子元素(a)移除这个属性 同事关联的下个元素隐藏 真尼玛操蛋 }) })
</script>
不多说 看得懂吧 强大的链式结构 注意每次链式结构后的对象是谁要确定!
$("table>tobody>tr:has(td:has(:checkbox:enabled))").css("background", "red");
这个更牛逼 函数has 代表判断是否含有该元素 不含有这链式中断 :checkbox 选择范围内所有的checkbox