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函 ...
随机推荐
- PTA寒假一
7-1 打印沙漏 (20 分) 本题要求你写个程序把给定的符号打印成沙漏的形状.例如给定17个"*",要求按下列格式打印 所谓"沙漏形状",是指每行输出奇数个符 ...
- nginx 文档链接
https://www.cnblogs.com/wcwnina/p/8728391.html NGINX简介 http://www.nginx.cn/doc/ ...
- html总结2
(1)选择器: 1.标签选择器:用于修饰同类HTML标签的共性风格 <style type="text/css"> li{ color:red; font-size:2 ...
- ios下表单post使用gzip模式
使用afnetworking,服务器参考的这里 ios端,使用自己的序列化类 manager.requestSerializer = [MyHttpRequestSerializer new];[ma ...
- 记录一下我在lubuntu里面用到的工具
文本编辑:Atom 文本对比:Beyond Compare 数据库工具:dbeaver Git工具:GitKraKen SVN工具:RapidSVN 网页编程工具:WebStorm 另外,14.04版 ...
- Code::Blocks 导入Makefile工程
1)“File -> New -> Project”,选择“Empty Project”并创建. 2)选中 Project,右键,选择“Add files”,将 c/c++ 和 head ...
- problem: vue之数组元素中的数组类型值数据改变却无法在子组件视图更新问题
问题:给父组件上的一个数组中的某个元素中的数组类型值,添加值后,数据没有在子组件上更新. 对元素添加值之后,vue的数据其实已经更新了并传给了子组件,子组件中没有立即更新. 那么这里有个问题,在子组件 ...
- Java中用字符串常量赋值和使用new构造String对象的区别
String str1 = "ABC"; String str2 = new String("ABC"); String str1 = “ABC”;可能创建一个 ...
- 如何将maven依赖项打进jar包，将一个完整的项目打进jar包
目的:我的目的就是将项目所有的文件,包括pom文件中依赖的jar包都打进一个jar包里面. 过程:将下面的内容放到pom文件里面. </dependencies> <build> ...
- java基础-反射(细节)
java面试题--java反射机制? Java反射机制的作用:1)在运行时判断任意一个对象所属的类.2)在运行时判断任意一个类所具有的成员变量和方法.3)在运行时任意调用一个对象的方法4)在运行时构造 ...