jQuery遍历之同级遍历（siblings、next、nextAll、nextUntil方法）

最新推荐文章于 2019-11-09 20:24:47 发布

飞翔的仙女杀手

最新推荐文章于 2019-11-09 20:24:47 发布

阅读量394

点赞数

CC 4.0 BY-SA版权

分类专栏： jquery 文章标签： js html jquery 前端

本文链接：https://blog.youkuaiyun.com/weixin_44253640/article/details/90272269

jquery 专栏收录该内容

16 篇文章

订阅专栏

本文介绍如何使用jQuery的siblings方法来改变指定元素的兄弟元素的样式，通过实例展示了siblings方法的效果，同时对比了next、nextAll及nextUntil等方法的不同作用。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在div中写下如下代码

div class="bd">
   <p>P</p>
   <h2>h2</h2>
   <h3>h3</h3>
   <h4>h4</h4>
   <h5>h5</h5>
   <h6>h6</h6>
</div>

$(document).ready(function(){
    $("h4").siblings().css({border:"3px solid #FF0000"});
    //除自己外所有同级元素都会被修改
    //$("h4").next().css({border:"3px solid #FF0000"});
    //下一个元素被修改
    //$("h4").nextAll().css({border:"3px solid #FF0000"});
    //下面的所有元素都被修改
    //$("h4").nextUntil("h6").css({border:"3px solid #FF0000"});
    //h4和h6之间的元素被修改
});

运行结果