注：expr是指可选的参数，包含用于匹配元素的选择器表达式。

　　.siblings(expr) ---查找所有兄弟（包括哥哥和弟弟）

　　.next(expr) ---查找紧挨着的弟弟

　　.nextAll(expr) ---查找所有的弟弟

　　.nextUntil(expr) ---查找所有弟弟，直到碰到符合expr条件，不包含符合expr条件的那个元素

　　.prev(expr) ---查找紧挨着的哥哥

　　.prevAll(expr) ---查找所有哥哥

　　.prevUntil(expr) ---查找所有哥哥，直到碰到符合expr条件，不包含符合expr条件的那个元素

测试代码：

 <body>

     <div class="first">

         <a href="#">我是a标签</a>

         <h1>我是h1</h1>

         <p>我是第1个p</p>

         <p>我是第2个p</p>

         <p>我是第3个p</p>

         <h3>我是h3</h3>

         <p class="qq">我是类为qq的第四个p</p>

         <p>我是第五个p</p>

         <h2>我是h2</h2>

     </div>

 </body>

测试1：让第一个p元素的所有兄弟改变背景颜色。

$('p:first').siblings().css('background','pink')

效果：

测试2：把第一个p元素的所有h2的元素改变。

$('p:first').siblings('h2').css('background','pink')

效果：

 测试3：把第一个p元素的下一个弟弟元素改变。

$('p:first').next().css('background-color','red')

效果：

测试4：把第一个p元素的所有弟弟元素改变。

$('p:first').nextAll().css('background','yellow')

效果：

 测试5：把第一个p元素，直到有类为qq的元素出现，的所有弟弟元素改变。

$('p:first').nextUntil('.qq').css({'font-size':20,background:'red'})

效果：

prev与next是一样的，只不过一个是哥哥，一个是弟弟，同样的prevAll和nextAll，prevUntil和nextUntil也基本一样，不再重复测试。

jquery 找同胞系列siblings() ,next() ,nextAll(), nextUntil(), prev(), prevAll(), prevUntil()的更多相关文章

  1. siblings() next() nextAll() nextUntil() prev() prevAll() prevUntil() 在 DOM 树中水平遍历

    $(document).ready(function(){ $("h2").siblings(); });拿到h2标签的所有的同级元素什么标签都可以 $(document).rea ...

  2. jQuery找兄弟系列next(),nextAll(),nextUntil(),prev(),prevAll(),prevUntil(),siblings()

    <body> <div id="main"> <div id="hot" class="rightbar"&g ...

  3. jQuery 遍历同胞(siblings)

    同胞拥有相同的父元素. 通过 jQuery,您能够在 DOM 树中遍历元素的同胞元素. 在 DOM 树中水平遍历 有许多有用的方法让我们在 DOM 树进行水平遍历: siblings() next() ...

  4. jQuery 遍历 – 同胞(siblings)

    同胞拥有相同的父元素. 通过 jQuery,您能够在 DOM 树中遍历元素的同胞元素. 在 DOM 树中水平遍历 有许多有用的方法让我们在 DOM 树进行水平遍历: siblings() next() ...

  5. jQuery 遍历 - 同胞(siblings)

    同胞拥有相同的父元素. 通过 jQuery,您能够在 DOM 树中遍历元素的同胞元素. 在 DOM 树中水平遍历 有许多有用的方法让我们在 DOM 树进行水平遍历: siblings() next() ...

  6. jQuery遍历-同胞

    同胞拥有相同的父元素. 通过 jQuery,您能够在 DOM 树中遍历元素的同胞元素. 在 DOM 树中水平遍历 有许多有用的方法让我们在 DOM 树进行水平遍历: siblings() next() ...

  7. siblings，next，prev

    同胞拥有相同的父元素. 通过 jQuery,您能够在 DOM 树中遍历元素的同胞元素. 在 DOM 树中水平遍历 siblings() next() nextAll() nextUntil() pre ...

  8. Jquery全选系列操作（锋利的jQuery）

    Jquery全选系列操作(锋利的jQuery) <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml" ...

  9. js进阶 14-1 jquery的ajax系列中的load方法的作用是什么

    js进阶 14-1 jquery的ajax系列中的load方法的作用是什么 一.总结 一句话总结:jQuery load()方法作用是从服务器加载数据,是一个简单但强大的AJAX方法. 1.load函 ...

随机推荐

  1. CentOS7 cannot find a valid baseurl for repo base

    找到文件夹: cd /etc/sysconfig/network-scripts/ 然后找ifcfg 开头的文件,挨个打开 里面有下面那些代码前三行的就是,添加后面DNS两行,保持并退出,然后继续执行 ...

  2. spark on yarn运行产生jar包冲突问题

    1.1 问题描述 Spark Streaming程序解析protobuf序列化的数据时,--jars 来添加依赖的protobuf-java-3.0.0.jar包,使用local模式程序正常,使用ya ...

  3. 【Java】字符串工具类

    import android.annotation.SuppressLint; import java.io.UnsupportedEncodingException; import java.uti ...

  4. XML二

    XML的语法要求: 1,XML文档必须有一个顶层元素,即文档元素,所有其他元素必须嵌入在文档元素中. 2,元素嵌套要正确,即如果一个元素在另一个元素中开始,那么必须在同一个元素中结束. 3,每个元素必 ...

  5. objdump和backtrace的配合使用

    在程序调试过程中程序崩溃的情况时有发生,把出问题时的调用栈信息打印出来是一种不错的解决办法. 当然还有一些其他方法:https://www.cnblogs.com/jiangyibo/p/865372 ...

  6. Linux 下安装FastDFS v5.08 的php扩展

    php扩展也需要依赖于FastDFS一些库文件,所以请先安装FastDFS,具体请看我之前的文章.   一.安装目录 php安装目录 /data/nmp/php FastDFS源码目录 /data/w ...

  7. Java自定义类加载器与双亲委派模型

    其实,双亲委派模型并不复杂.自定义类加载器也不难!随便从网上搜一下就能搜出一大把结果,然后copy一下就能用.但是,如果每次想自定义类加载器就必须搜一遍别人的文章,然后复制,这样显然不行.可是自定义类 ...

  8. @Transactional 可以写在 Controller 方法上面了

    上图  t1  掉用的service 没定义事物环境,但是 在 t1 上面定义了. 依旧可以 在 参数是5 的 时候 ,让 前面的操作级联回滚.  但是 我不建议这么用,除非特殊需求,正常来说事物根据 ...

  9. SVN简单使用

    如果是window操作系统,默认安装.右键菜单就会有显示SVN 如果已经配置好SVN,直接确定既可以检出. 如果没有配置,那么会显示下面的验证: 输入用户名和密码即可

  10. 如何在hanlp词典中手动添加未登录词

     我们在使用hanlp词典进行分词的时候,难免会出现分词不准确的情况,原因是由于内置词典中并没有收录当前的这个词,也就是我们所说的未登录词,只要把这个词加入到内置词典中就可以解决类似问题,如何操作,下 ...