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函 ...
随机推荐
- 关于idea的debug
idea的debug真的是超级好用哎.分享几个今天学会的新方式: 1.右键会发现此选项 ,点击出现 在输入框中输入,可以通过某些公式单独计算. 2.点击属性值,右键点击set values 会出现一个 ...
- ipv4-only网络环境下访问ipv6站点
使用6plat.org+openVPN(无需资金投入)进入ipv6网络 这里我们主要使用的是6plat.org提供的“46模块——IPv4到IPv6”功能,需要配合openVPN这个软件,支持wind ...
- spring boot 项目无法访问静态页面
- 12.python-metaclass元类
1.python中一切皆是对象,类本身也是一个对象,当使用关键字class的时候,python解释器在加载class的时候会创建一个对象(这里的对象指的是类而非类的实例) class Foo: #cl ...
- java-IO流-字节流-概述及分类、FileInputStream、FileOutputStream、available()方法、定义小数组、BufferedInputStream、BufferedOutputStream、flush和close方法的区别、流的标准处理异常代码
1.IO流概述及其分类 * 1.概念 * IO流用来处理设备之间的数据传输 * Java对数据的操作是通过流的方式 * Java用于操作流的类都在IO包中 * ...
- Centos7 安装Nginx 防火墙开放80端口给外网访问
Centos7的防火墙改成了firewall,不再叫iptables,开放端口的方法如下: firewall-cmd --zone=public --add-port=80/tcp --permane ...
- 使用vsftp服务传输文件
- 算法图解 (Aditya Bhargava 著)
第1章 算法简介第2章 选择排序第3章 递归第4章 快速排序第5章 散列表第6章 广度优先搜索第7章 狄克斯特拉算法第8章 贪婪算法第9章 动态规划第10章 K最近邻算法第11章 接下来如何做 第1章 ...
- springboot对oracle的配置
spring.jpa.database=oracle spring.datasource.driver-class-name=oracle.jdbc.driver.OracleDriver sprin ...
- Java中用字符串常量赋值和使用new构造String对象的区别
String str1 = "ABC"; String str2 = new String("ABC"); String str1 = “ABC”;可能创建一个 ...