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 相关文章推荐
强制设为首页代码
Jun 19 Javascript
javascript实现的动态添加表单元素input,button等(appendChild)
Nov 24 Javascript
Extjs Gird 支持中文拼音排序实现代码
Apr 15 Javascript
javascript获取flash版本号的方法
Nov 20 Javascript
jQuery中noConflict()用法实例分析
Feb 08 Javascript
jQuery实例—选项卡的简单实现(js源码和jQuery)
Jun 14 Javascript
jQuery实现的手风琴侧边菜单效果
Mar 29 jQuery
jQury Ajax使用Token验证身份实例代码
Sep 22 Javascript
webstorm中vue语法的支持详解
May 09 Javascript
js实现详情页放大镜效果
Oct 28 Javascript
Vue如何实现组件间通信
May 15 Vue.js
JavaScript中的宏任务和微任务详情
Nov 27 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的配置文件php.ini
2006/10/09 PHP
提示Trying to clone an uncloneable object of class Imagic的解决
2011/10/27 PHP
for循环连续求和、九九乘法表代码
2012/02/20 PHP
Win2003+apache+PHP+SqlServer2008 配置生产环境
2014/07/29 PHP
php实现读取内存顺序号
2015/03/29 PHP
Yii2表单事件之Ajax提交实现方法
2017/05/04 PHP
PHP实现的字符串匹配算法示例【sunday算法】
2017/12/19 PHP
javaScript checkbox 全选/反选及批量删除
2010/04/28 Javascript
JavaScript基础知识之数据类型
2012/08/06 Javascript
javascript中简单的进制转换代码实例
2013/10/26 Javascript
如何改进javascript代码的性能
2015/04/02 Javascript
JS实现下拉菜单赋值到文本框的方法
2015/08/18 Javascript
基于HTML+CSS,jQuery编写的简易计算器后续(添加了键盘监听)
2016/01/05 Javascript
详解nodeJS之二进制buffer对象
2017/06/03 NodeJs
详解如何使用router-link对象方式传递参数?
2019/05/02 Javascript
借助云开发实现小程序短信验证码的发送
2020/01/06 Javascript
JS运算符优先级与表达式示例详解
2020/09/04 Javascript
Python编程中用close()方法关闭文件的教程
2015/05/24 Python
python爬虫入门教程--利用requests构建知乎API(三)
2017/05/25 Python
Python数据结构与算法之字典树实现方法示例
2017/12/13 Python
python matplotlib 在指定的两个点之间连线方法
2018/05/25 Python
解决python3 urllib 链接中有中文的问题
2018/07/16 Python
Python学习笔记之集合的概念和简单使用示例
2019/08/22 Python
python bluetooth蓝牙信息获取蓝牙设备类型的方法
2019/11/29 Python
如何用Python编写一个电子考勤系统
2021/02/08 Python
css3弹性盒模型(Flexbox)详细介绍
2014/10/08 HTML / CSS
HTML5 Web缓存和运用程序缓存(cookie,session)
2018/01/11 HTML / CSS
全球速卖通法国在线交易平台:AliExpress法国
2017/07/07 全球购物
送给程序员的20个Java集合面试问题
2014/08/06 面试题
大学生自我鉴定书
2014/03/24 职场文书
赡养老人协议书
2014/04/21 职场文书
法制宣传标语
2014/06/23 职场文书
试用期员工工作自我评价
2014/09/10 职场文书
再婚婚前财产协议书范本
2014/10/19 职场文书
支教个人总结
2015/03/04 职场文书
2016年十一促销广告语
2016/01/28 职场文书