jQuery获取兄弟元素的各种方法总结

JavaScript012

jQuery获取兄弟元素的各种方法总结,第1张

1.next()//获取当前元素的下一个兄弟元素

2.nextAll()//获取当前元素后面所有的兄弟元素

3.prev()//获取当前元素的前一个兄弟元素

4.prevAll()//获取当前元素前面的所有兄弟元素

5.siblings()//获取当前元素的所有兄弟元素

6.children()//获取一个元素的直接子元素,类似于 $(‘ul >li’)

7.find()//获取一个元素的某种所有子元素,类似于 $(‘ul li’)

8.parent()//获取当前元素的父元素

参考

找到目标元素的父元素,再找到它的子元素即可:

目标元素.parentNode.childNode

然后再通过循环给每个元素更改样式即可。当然这里面也包括了目标元素,要不要排除掉就看你了

也可以直接找目标元素的兄弟元素,但这要分两步走:往前找和往后找,除非目标元素是所有兄弟里面的老大或老幺,倒不如通过老爸直接找到所有兄弟来得更快更方便。

$('#id').siblings() 当前元素所有的兄弟节点

$('#id').prev() 当前元素前一个兄弟节点

$('#id').prevaAll() 当前元素之前所有的兄弟节点

$('#id').next() 当前元素之后第一个兄弟节点

$('#id').nextAll() 当前元素之后所有的兄弟节点

这三个方法都可以添加选择器,给出选择条件,就能找到你指定的兄弟节点了。