div, span, p {width: 140px;height: 140px;margin: 5px;background: #aaa;border: #000 1px solid;float: left;font-size: 17px;font-family: Verdana;}div.mini {width: 55px;height: 55px;background-color: #aaa;font-size。jquert|jQuery子元素过滤选择器。" />

jquert|jQuery子元素过滤选择器

Untitled Document - 锐客网 ="text/css"> div, span, p { width: 140px; height: 140px; margin: 5px; background: #aaa; border: #000 1px solid; float: left; font-size: 17px; font-family: Verdana; }div.mini { width: 55px; height: 55px; background-color: #aaa; font-size: 12px; }div.hide { display: none; } ="text/javascript" src="https://www.it610.com/article/jquery-1.7.2.js"> ="text/javascript"> $(document).ready(function(){ $("#btn1").click(function() { //选取子元素, 需要在选择器前添加一个空格. //选取每个class为one的div父元素下的第2个子元素 $(".one :nth-child(2)").css("background","#ffbbaa"); }); $("#btn2").click(function() { //选取每个class为one的div父元素下的第一个子元素 $(".one :first-child").css("background","#ffbbaa"); }); $("#btn3").click(function() { //选取每个class为one的div父元素下的最后一个子元素 $(".one :last-child").css("background","#ffbbaa"); }); $("#btn4").click(function() { //如果class为one的div父元素下的仅仅只有一个子元素,那么选中这个子元素 $(".one :only-child").css("background","#ffbbaa"); }); });

id 为 one,class 为 one 的div
class为mini
id为two,class为one,title为test的div
class为mini,title为other
class为mini,title为test
class为mini
class为mini
class为mini
class为mini
class为mini
class为mini
class为mini,title为tesst
class为"hide"的div
包含input的type为"hidden"的div
正在执行动画的div元素.

    推荐阅读