注: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. Python学习笔记第二十七周(Bootstrap)

    目录: 全局样式 一.栅格系统 二.表单 三.按钮  四.导航 五.按钮组 六.面板 七.表格 八.分页 九.排版 十.图片 十一.辅助类 十二.响应式工具 组件 内容: 前言: 首先通过https: ...

  2. Git版本库创建(包含文件权限设置 Linux环境下)

    确保git服务已安装成功,如果没有安装git服务查看:Git源码安装 Linux指定安装目录 1.创建git用户,并设置密码.并禁止git用户通过shell登录服务器(注意如果需要安装gitolite ...

  3. top命令详解---待完善

    Top可以看到的cpu信息有: Tasks: 29 total, 1 running, 28 sleeping, 0 stopped, 0 zombie Cpu(s): 0.3% us, 1.0% s ...

  4. 学习笔记TF017:自然语言处理、RNN、LSTM

    自然语言处理 (NLP)问题都是序列化的.前馈神经网络,在单次前馈中对到来数据处理,假定所有输入独立,模式丢失.循环神经网络(recurrent neural network,RNN)对时间显式建模神 ...

  5. vs2017 打开cs文件提示无法识别的GUID格式

    总结一句话 no zuo no die. 是我自己在注册表中给vs增加了自动以管理员身份运行,把值给错了,弄成了 ~ RUNASADMIN WIN7RTM, 改成 ~ RUNASADMIN 后OK.还 ...

  6. C++类中一个构造函数调用另一个构造函数

    class A { int a; int b; int c; public: A(int aa, int bb) : a(aa), b(bb),c(0) { cout << "a ...

  7. uboot下读取flash,上传tftp服务器、下载

    上传 setenv gatewayip 192.168.1.1; setenv serverip 192.168.1.7; setenv ipaddr 192.168.1.156 ; mw.b 0x8 ...

  8. 我发起了一个 网格计算 协议 开源项目 GridP

    GridP  是   Grid Protocol   的 全称  . 我在 <关于软件产业的两个契机>  https://www.cnblogs.com/KSongKing/p/95319 ...

  9. eclipse中mybatis自动生成插件使用

    对于使用Mybatis的开发者来说, 使用mybatis generator来生成mapper 以及配置文件, 可以大大简化工作, mybatis generator有多种工作方式, eclipse插 ...

  10. angularjs 的模型无法绑定到隐藏域(input hidden)

    描述一下问题: 在操作表单中的隐藏域的时候发现angularjs的模型无法绑定,比如: <input type="hidden" name="someData&qu ...