jquery 找同胞系列siblings() ,next() ,nextAll(), nextUntil(), prev(), prevAll(), prevUntil()
注: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()的更多相关文章
- siblings() next() nextAll() nextUntil() prev() prevAll() prevUntil() 在 DOM 树中水平遍历
$(document).ready(function(){ $("h2").siblings(); });拿到h2标签的所有的同级元素什么标签都可以 $(document).rea ...
- jQuery找兄弟系列next(),nextAll(),nextUntil(),prev(),prevAll(),prevUntil(),siblings()
<body> <div id="main"> <div id="hot" class="rightbar"&g ...
- jQuery 遍历同胞(siblings)
同胞拥有相同的父元素. 通过 jQuery,您能够在 DOM 树中遍历元素的同胞元素. 在 DOM 树中水平遍历 有许多有用的方法让我们在 DOM 树进行水平遍历: siblings() next() ...
- jQuery 遍历 – 同胞(siblings)
同胞拥有相同的父元素. 通过 jQuery,您能够在 DOM 树中遍历元素的同胞元素. 在 DOM 树中水平遍历 有许多有用的方法让我们在 DOM 树进行水平遍历: siblings() next() ...
- jQuery 遍历 - 同胞(siblings)
同胞拥有相同的父元素. 通过 jQuery,您能够在 DOM 树中遍历元素的同胞元素. 在 DOM 树中水平遍历 有许多有用的方法让我们在 DOM 树进行水平遍历: siblings() next() ...
- jQuery遍历-同胞
同胞拥有相同的父元素. 通过 jQuery,您能够在 DOM 树中遍历元素的同胞元素. 在 DOM 树中水平遍历 有许多有用的方法让我们在 DOM 树进行水平遍历: siblings() next() ...
- siblings,next,prev
同胞拥有相同的父元素. 通过 jQuery,您能够在 DOM 树中遍历元素的同胞元素. 在 DOM 树中水平遍历 siblings() next() nextAll() nextUntil() pre ...
- Jquery全选系列操作(锋利的jQuery)
Jquery全选系列操作(锋利的jQuery) <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml" ...
- js进阶 14-1 jquery的ajax系列中的load方法的作用是什么
js进阶 14-1 jquery的ajax系列中的load方法的作用是什么 一.总结 一句话总结:jQuery load()方法作用是从服务器加载数据,是一个简单但强大的AJAX方法. 1.load函 ...
随机推荐
- element ui表格相同内容自动合并
一开始觉得合并单元格很困难,什么鬼,后来仔细查看api,发现是可以实现的,特此记录下,直接看代码, 项目需求是第一列和第二列还有第16列需要相同内容进行合并,所以判断条件是不同的: 实现后效果如下: ...
- Linux 查看端口被什么程序占用
lsof -i:8899 输出: COMMAND PID USER FD TYPE DEVICE SIZE/OFF NODE NAMEjava 38889 root 329u IPv6 5883661 ...
- 3.2 unittest执行顺序
3.2 unittest执行顺序 前言很多初学者在使用unittest框架时候,不清楚用例的执行顺序到底是怎样的.对测试类里面的类和方法分不清楚,不知道什么时候执行,什么时候不执行.本篇通过最简单案例 ...
- Linq中的左连,右连,内连
1.左连接: var LeftJoin = from emp in ListOfEmployeesjoin dept in ListOfDepartmenton emp.DeptID equals d ...
- linux基础之系统管理类命令
系统管理类命令 1.reboot.halt.poweroff命令 基本介绍 reboot命令.halt命令.poweroff命令:都表示重启或者关闭系统 基本语法 reboot/halt/powero ...
- oracle query
不等值连接查询 员工工资级别 select e.empno,e.ename,e.sal,s.grade from emp e,salgrade s where e.sal between s.losa ...
- ios-项目启动页面
项目运行启动页面: 点工程项目targets-(或Images.xcasets)-LaunchImage(iphone四种规格图片:320*480/350*568/640*960/640*1136)将 ...
- 使用ssh服务管理远程主机
- _Bool and bool
_Bool is the defined before C99. bool has been defined in C99. bool is an alias for _Bool if you inc ...
- 二、tcp/ip基础知识
一.TCP/IP的标准化 1.TCP/IP的含义 一般来说,TCP/IP是利用IP进行通信时所必须用到的协议群的统称. 具体点,IP或ICMP.TCP或UDP.TELENT或FTP.以及HTTP等都属 ...