jquery 层次选择器siblings与nextAll的区别介绍


Posted in Javascript onAugust 02, 2013

HTML代码:

<div> 
<div >1</div> 
<div class="one"> 
2 
<div>2_1 
<div>2_1_1</div> 
</div> 
<div>2_2</div> 
</div> 
<div>3</div> 
<div>4</div> 
</div> 
$(".one div").css("background","red") // .one之后所有DIV后代元素(后代:包括儿子和孙子.....) 
$(".one > div").css("background","red") // .one之后的子元素。(子:儿子和女儿....) 
$(".one + div").css("background","red") // .one之后相邻的元素。就是紧靠.one之后的兄弟元素。只有一个 
$(".one").next().css("background","red") // 这个作用同上 
$(".one ~ div").css("background","red") //.one之后的兄弟元素。不包括前面的 
$(".one").nextAll().css("background","red") //作用同上 
$(".one").siblings().css("background","red") // .one所有的兄弟元素,不管是后面的还是前面的。
Javascript 相关文章推荐
js文件缓存之版本管理详解
Jul 05 Javascript
jquery实现移动端点击图片查看大图特效
Sep 11 Javascript
JS 面向对象之继承---多种组合继承详解
Jul 10 Javascript
js中scrollTop()方法和scroll()方法用法示例
Oct 03 Javascript
js返回顶部实例分享
Dec 21 Javascript
vue2.0父子组件间通信的实现方法
Apr 19 Javascript
React Native如何消除启动时白屏的方法
Aug 08 Javascript
Vue全局分页组件的实现代码
Aug 10 Javascript
详解关闭令人抓狂的ESlint 语法检测配置方法
Oct 28 Javascript
vue项目中定义全局变量、函数的几种方法
Nov 08 Javascript
json_decode 索引为数字时自动排序问题解决方法
Mar 28 Javascript
解决vue 使用axios.all()方法发起多个请求控制台报错的问题
Nov 09 Javascript
js 固定悬浮效果实现思路代码
Aug 02 #Javascript
仿新浪微博登陆邮箱提示效果的js代码
Aug 02 #Javascript
页面右下角弹出提示框示例代码js版
Aug 02 #Javascript
js获取IP和PcName(IE)在vs中可用
Aug 02 #Javascript
js获取location.href的参数实例代码
Aug 02 #Javascript
使用GruntJS链接与压缩多个JavaScript文件过程详解
Aug 02 #Javascript
把jquery 的dialog和ztree结合实现步骤
Aug 02 #Javascript
You might like
PHP静态类
2006/11/25 PHP
使用php shell命令合并图片的代码
2011/06/23 PHP
PHP 芝麻信用接入的注意事项
2016/12/01 PHP
在Yii2特定页面如何禁用调试工具栏Debug Toolbar详解
2017/08/07 PHP
淘宝搜索框效果实现分析
2011/03/05 Javascript
JS实现遮罩层效果的简单实例
2013/11/12 Javascript
js阻止冒泡及jquery阻止事件冒泡示例介绍
2013/11/19 Javascript
在HTML代码中使用JavaScript代码的例子
2014/10/16 Javascript
JavaScript中Number.MAX_VALUE属性的使用方法
2015/06/04 Javascript
jQuery实现拖拽页面元素并将其保存到cookie的方法
2016/06/12 Javascript
node.js入门学习之url模块
2017/02/25 Javascript
javascript编程实现栈的方法详解【经典数据结构】
2017/04/11 Javascript
原生JS 购物车及购物页面的cookie使用方法
2017/08/21 Javascript
详解Angular2学习笔记之Html属性绑定
2018/01/03 Javascript
vue 更改连接后台的api示例
2019/11/11 Javascript
利用node.js开发cli的完整步骤
2020/12/29 Javascript
[41:54]2018DOTA2亚洲邀请赛 4.1 小组赛A组加赛 TNC vs Liquid
2018/04/03 DOTA
Python中的异常处理学习笔记
2015/01/28 Python
Python Numpy 数组的初始化和基本操作
2018/03/13 Python
python使用turtle绘制分形树
2018/06/22 Python
Python定义二叉树及4种遍历方法实例详解
2018/07/05 Python
Python迭代器与生成器基本用法分析
2018/07/26 Python
python判断完全平方数的方法
2018/11/13 Python
java判断三位数的实例讲解
2019/06/10 Python
Python 字符串处理特殊空格\xc2\xa0\t\n Non-breaking space
2020/02/23 Python
10个python3常用排序算法详细说明与实例(快速排序,冒泡排序,桶排序,基数排序,堆排序,希尔排序,归并排序,计数排序)
2020/03/17 Python
Python ADF 单位根检验 如何查看结果的实现
2020/06/03 Python
如何在keras中添加自己的优化器(如adam等)
2020/06/19 Python
印尼美容产品购物网站:PerfectBeauty.id
2017/12/01 全球购物
说出ArrayList,Vector, LinkedList的存储性能和特性
2015/01/04 面试题
副总经理工作职责
2013/11/28 职场文书
单位门卫岗位职责
2013/12/20 职场文书
保护动物倡议书
2014/04/15 职场文书
党性教育心得体会
2014/09/03 职场文书
婚礼双方父亲致辞
2015/07/27 职场文书
vue-cil之axios的二次封装与proxy反向代理使用说明
2022/04/07 Vue.js