获取兄弟节点的常用方法有:
方法 | 说明 |
siblings() | 选取所有兄弟节点 |
next() | 选取后面兄弟节点 |
nextAll() | 选取所有后面的兄弟节点 |
nextUntil() | 选取所有后面的兄弟节点,但不包含后面指定的节点及指定节点的弟弟……。 |
prev() | 选取前面的兄弟节点 |
prevAll() | 选取所有前面的兄弟节点 |
prevUntil() | 选取所有前面的兄弟节点,但不包含后面指定的节点及指定节点的哥哥……。 |
获取所有兄弟节点
使用方法siblings()
示例:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
|
<!DOCTYPE html>
<
html
>
<
head
>
<
meta
charset
=
"UTF-8"
>
<
title
>兄弟节点</
title
>
<
style
>
.box{
border: 1px solid blueviolet;
padding: 1px;
margin-bottom: 12px;
}
</
style
>
</
head
>
<
body
>
<
div
>
<
ul
id
=
"ul"
>
<
li
id
=
"a"
>鼠标</
li
>
<
li
id
=
"b"
>键盘</
li
>
<
li
id
=
"c"
>屏幕</
li
>
<
li
id
=
"d"
><
a
>电源</
a
></
li
>
</
ul
>
</
div
>
<
script
>
$('#c').siblings().attr("class", "box");
</
script
>
</
body
>
</
html
>
|
获取下个兄弟节点
使用方法next()
示例:
1
|
$(
'#c'
).next().attr(
"class"
,
"box"
);
|
获取所有后面的兄弟节点
使用方法nextAll()
示例:
1
|
$(
'#a'
).nextAll().attr(
"class"
,
"box"
);
|