jquery学习之siblings解析

最新推荐文章于 2023-02-02 22:08:33 发布

sunnana

最新推荐文章于 2023-02-02 22:08:33 发布

阅读量97

点赞数

分类专栏： jQuery 文章标签： jquery ViewUI

本文链接：https://blog.csdn.net/sunnana/article/details/84600398

版权

jQuery 专栏收录该内容

10 篇文章 0 订阅

订阅专栏

siblings(".selected")查找所有类名为"selected"的同胞元素

<!DOCTYPE html>
<html>
<head>
  <script type="text/javascript" src="/jquery/jquery.js"></script>
</head>

<body>
  <div><span>Hello</span></div>
  <p class="selected">Hello Again</p>
  <p>And Again</p>


<script>
$("p").siblings(".selected").css("background", "yellow");
</script>

</body>
</html>

result：
<p class="selected">的背景色被设置为黄色。


<!DOCTYPE html>
<html>
<head>
  <script type="text/javascript" src="/jquery/jquery.js"></script>
</head>

<body>
<ul>
   <li>list item 1</li>
   <li>list item 2</li>
   <li class="third-item">list item 3</li>
   <li class="selected">list item 4</li>
   <li>list item 5</li>
</ul>
<div class="selected"></div>

<script>
$('li.third-item').siblings(".selected").css('background-color', 'red');
</script>

</body>
</html>
result:只有第四个li被选中。

要想同时选中第三个li，则要使用andSelf().