jQuery中的siblings()方法
时间: 2023-11-16 20:51:39 浏览: 107
jquery遍历函数siblings()用法实例
`siblings()`是jQuery中的一个方法,它用于选择元素的同级兄弟元素。
使用`siblings()`方法可以选择与当前元素同级的其他元素。这个方法接受一个可选的选择器作为参数,用于进一步筛选同级元素。
以下是一个示例代码,演示了如何使用`siblings()`方法:
```html
<!DOCTYPE html>
<html>
<head>
<title>Siblings Example</title>
<style>
.selected {
color: red;
}
</style>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function() {
// 当点击列表项时,为其同级兄弟元素添加选中样式
$('li').on('click', function() {
$(this).siblings().addClass('selected');
});
});
</script>
</head>
<body>
<ul>
<li>列表项1</li>
<li>列表项2</li>
<li>列表项3</li>
</ul>
</body>
</html>
```
在这个示例中,我们有一个包含多个列表项的无序列表。当用户点击任何一个列表项时,使用`siblings()`方法选择其同级兄弟元素,并使用`addClass()`方法为它们添加一个名为"selected"的样式类。这样就能实现为其他同级兄弟元素添加选中样式的效果。
请注意,通过`siblings()`方法选择的兄弟元素不包括当前元素本身。
阅读全文