Jquery专栏

父子关系选择节点

高级选择器:

$(function(){

=============后代节点===========

//find后代选择器

$('#box').find('p').css('color','red');//find后代选择器的方法(子节点和孙子节点)

//children子选择器,相当于#box > p

$('#box').children('p').css('color','red');//只选中子代的p

===========上级节点=============

$('li').parent().css('color','red');//获取当前元素的父节点

$('li').parents().css('color','red');//获取当前元素的祖先节点

$('li').parentUntil('body').css('color','red');//遇到body父节点停止

===========同级节点=============

//next当前节点的后一个同级节点,相当于#box+p

$('#box').next('p').css('color','red');

//nextAll当前节点之后的所有同级节点,相当于#box~p

$('#box').nextAll('p').css('color','red');

//prev当前节点的上一个同级节点

$('#box').prev('p').css('color','red');

//prevAll当前节点的上面所有同级节点

$('#box').prevAll('p').css('color','red');

nextUntil()当前节点的下面同级非指定所有节点(不是p的元素选定,是p的则停止)

$('#box').nextUntil('p').css('color','red');

prevUntil()当前节点的上面同级非指定所有节点(不是p的元素选定,是p的则停止)

$('#box').prevUntil('p').css('color','red');

siblings()同级上下所有元素选定

$('#box').siblings('p').css('color','red');

});


评论

评论(0)

后面还有条评论,点击查看>>