一、简单选择器
二、进阶选择器
、
三、高级选择器
//后代选择器
$('#box p').css('color', 'red'); //全兼容
jQuery 为后代选择器提供了一个等价find()方法
$('#box').find('p').css('color', 'red'); //和后代选择器等价
//子选择器,孙子后失明
#box > p { //IE6 不支持
color:red;
}
$('#box > p').css('color', 'red'); //兼容IE6
jQuery 为子选择器提供了一个等价children()方法:
$('#box').children('p').css('color', 'red'); //和子选择器等价
//next 选择器(下一个同级节点)
#box + p { //IE6 不支持
color:red;
}
$('#box+p').css('color', 'red'); //兼容IE6
jQuery 为next 选择器提供了一个等价的方法next():
$('#box').next('p').css('color', 'red'); //和next 选择器等价
//nextAll 选择器(后面所有同级节点)
#box ~ p { //IE6 不支持
color:red;
}
$('#box ~ p').css('color', 'red'); //兼容IE6
jQuery 为nextAll 选择器提供了一个等价的方法nextAll():
$('#box').nextAll('p').css('color', 'red'); //和nextAll 选择器等价