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函 ...
随机推荐
- linux ipv6开启的配置文件
1./etc/sysconfig/network-scripts/ifcfg-eth0 DEVICE=eth0TYPE=EthernetUUID=9d1d6e2a-cfc5-4e60-8f28-b77 ...
- java mysql数据库链接与资源关闭
/** * Created by Clear on 2018/8/11. * here provide the kind of connections from mysql database,and ...
- git教程: 创建版本库
转载:创建版本库 什么是版本库呢?版本库又名仓库,英文名repository,你可以简单理解成一个目录,这个目录里面的所有文件都可以被Git管理起来,每个文件的修改.删除,Git都能跟踪,以便任何时刻 ...
- Navicat For MySQL--外键建立与cannot add foreign key constraint分析
hrm_job.png 参考资料: https://blog.csdn.net/ytm15732625529/article/details/53729155 https://www.cnblogs. ...
- python学习之路03
一.常量和变量 1.python中的数据类型 分类: Number:数字型[整型,浮点型,复数] String:字符串型 Boolean:布尔型[True,False] None:空值 ...
- Python开发 基礎知識 (未完代補)
一.Python基本知識 1.Python屬高階語言,所編築的是字節碼 2.一般狀態statement 終止於換行,如需使用多數行編寫,可在行末加上 \,以表延續 但在 parentheses ( ) ...
- PythonStudy——运算符优先级 Operator precedence
运算符优先级 以下所列优先级顺序按照从低到高优先级的顺序:同行为相同优先级. 1 Lambda #运算优先级最低 2 逻辑运算符: or 3 逻辑运算符: and 4 逻辑运算符:not 5 成员测试 ...
- PythonStudy——python中如何使输出不换行
1.在python 3.x版本中,使用print(,end="") 可使输出不换行, 例如:
- kindle試玩
Q:試玩感受如何? Pros 按這個版本,沒有燈,在光纖不好的時候看起來很累.但陽光好的時候看起來很爽 重量很輕,比手機邀請很多 看書很容易沉浸下去,這一點比收集好狠毒 Cons 網上說看pdf不大行 ...
- scoping作用域,anonymous function匿名函数,built-in functions内置函数
作用域练习1 def test1(): print('in the test1') def test(): print('in the test') return test1 res = test() ...