jquery next nextAll nextUntil siblings的区别介绍


Posted in Javascript onOctober 05, 2013

next:紧挨着$('')的一个元素

nextAll:在$('')以后的所有的同辈元素

nextUntil:until有直到。。。之前的意思,所以他表示$('')以后的所有的同辈元素,不过要在nextUntil参数之前,不包括匹配的元素本身

sibings:$('')前后的所有同辈元素

简单理解就是,next就是找他的弟弟/妹妹,nextAll就是找他所有的弟弟/妹妹,nextUntil就是找比他小一定年龄的弟弟/妹妹,siblings就是找他所有的哥哥/姐姐,还有他的所有的弟弟/妹妹。所以同理的同辈关系,prev,prevAll ,prevUntil

下面是简单的测试代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> 
<head> 
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> 
<title>Document</title> 
<script type='text/javascript' src='http://code.jquery.com/jquery-1.9.1.min.js'></script> 
</head> 
<body> 
<div class="first"> 
<a href="#">hhh</a> 
<h1>这是一个标题</h1> 
<p>这是一个test</p> 
<p>这是一个test</p> 
<p>这是一个test</p> 
<p>这是一个test</p> 
<div>hhha</div> 
<p>这是一个test</p> 
<p>这是一个test</p> 
</div> 
<script> 
$(function(){ 
//$('p:first').next().css('background','red'); 
//$('p:first').nextAll().css('background','yellow'); 
//$('p:first').nextUntil('div').css({'font-size':20,background:'red'}); 
//$('p:first').siblings().css('background','yellow'); 
}); 
</script> 
</body> 
</html>
Javascript 相关文章推荐
用JS写的一个TableView控件代码
Jan 23 Javascript
JQuery自适应IFrame高度(支持嵌套 兼容IE,ff,safafi,chrome)
Mar 28 Javascript
jQuery使用数组编写图片无缝向左滚动
Dec 11 Javascript
jQuery事件绑定.on()简要概述及应用
Feb 07 Javascript
JavaScript splice()方法详解
Sep 22 Javascript
JS不间断向上滚动效果代码
Dec 25 Javascript
Jquery插件easyUi表单验证提交(示例代码)
Dec 30 Javascript
jQuery中contents()方法用法实例
Jan 08 Javascript
AngularJS iframe跨域打开内容时报错误的解决办法
Jan 26 Javascript
bootstrap fileinput完整实例分享
Nov 08 Javascript
微信小程序实现动态设置placeholder提示文字及按钮选中/取消状态的方法
Dec 14 Javascript
js实现微信/QQ直接跳转到支付宝APP打开口令领红包功能
Jan 09 Javascript
jquery中animate动画积累的解决方法
Oct 05 #Javascript
jQuery.fn和jQuery.prototype区别介绍
Oct 05 #Javascript
javascript 函数声明与函数表达式的区别介绍
Oct 05 #Javascript
javascript自启动函数的问题探讨
Oct 05 #Javascript
纯js简单日历实现代码
Oct 05 #Javascript
JS教程:window.location使用方法的区别介绍
Oct 04 #Javascript
js中单引号与双引号冲突问题解决方法
Oct 04 #Javascript
You might like
PHP5.0对象模型探索之抽象方法和抽象类
2006/09/05 PHP
php反射应用示例
2014/02/25 PHP
PHP实现的多文件上传类及用法示例
2016/05/06 PHP
PHP实现的分解质因数操作示例
2018/08/01 PHP
PHP 实现链式操作
2021/03/09 PHP
js弹出层包含flash 不能关闭隐藏的2种处理方法
2013/06/17 Javascript
如何使用Javascript获取距今n天前的日期
2013/07/08 Javascript
如何动态的导入js文件具体该怎么实现
2014/01/14 Javascript
Javascript模仿淘宝信用评价实例(附源码)
2015/11/26 Javascript
详解BootStrap中Affix控件的使用及保持布局的美观的方法
2016/07/08 Javascript
Bootstrap常用组件学习(整理)
2017/03/24 Javascript
BootStrap入门学习第一篇
2017/08/28 Javascript
Angular中的$watch方法详解
2017/09/18 Javascript
mongoose设置unique不生效问题的解决及如何移除unique的限制
2017/11/07 Javascript
小程序实现留言板
2018/11/02 Javascript
Vue 指令实现按钮级别权限管理功能
2019/04/23 Javascript
VUE-ElementUI 自定义Loading图操作
2020/11/11 Javascript
Python模块学习 re 正则表达式
2011/05/19 Python
Python入门篇之列表和元组
2014/10/17 Python
Python中decorator使用实例
2015/04/14 Python
基于python3实现socket文件传输和校验
2018/07/28 Python
python实现邮件发送功能
2019/08/10 Python
EGO Shoes美国/加拿大:英国时髦鞋类品牌
2018/08/04 全球购物
Fossil德国官网:化石手表、手袋、珠宝及配件
2019/12/07 全球购物
美国价格实惠的在线眼镜网站:Zeelool
2020/12/25 全球购物
会计系个人求职信范文分享
2013/12/20 职场文书
《蓝色的树叶》教学反思
2014/02/24 职场文书
小组口号大全
2014/06/09 职场文书
中韩经贸翻译专业大学生职业生涯规划范文
2014/09/18 职场文书
向国旗敬礼学生寄语大全
2014/09/30 职场文书
公司开除员工通知
2015/04/22 职场文书
2015年扫黄打非工作总结
2015/05/13 职场文书
埃及王子观后感
2015/06/16 职场文书
班主任班级管理心得体会
2016/01/07 职场文书
python识别围棋定位棋盘位置
2021/07/26 Python
Python通过loop.run_in_executor执行同步代码 同步变为异步
2022/04/11 Python