JQuery 选择和过滤方法代码总结


Posted in Javascript onNovember 19, 2010

1、查找所有符合条件的元素 find()
     举例: $('ul').find('li').addClass('tmpExample');
               查找页面中ul元素下的所有li元素,并为查找到的li元素增加tmpExample样式。

2、查找指定元素的兄弟节点 siblings()
     举例:$('li#tmpCarrot').slblings().addClass('tmpExample');
              查找ID为tmpCarrot的li元素所有的兄弟节点,并为查找到的兄弟节点增加tmpExample样式。
              可以在slblings()的括号中添加选择器来查找指定条件的兄弟节点。如:slblings('.tmpClass'),就是查找类

为tmpClass的兄弟节点。

3、查找指定节点的下一个兄弟节点 next()
     举例:$('li#tmpBroccoli').next().addClass('tmpExample');
              查找ID为tmpBroccoli的li节点的下一兄弟节点。并为查找到的兄弟节点增加tmpExample样式。

4、查找指定节点的后面的所有兄弟节点 next()
     举例:$('li#tmpBroccoli').nextAll().addClass('tmpExample');
              查找ID为tmpBroccoli的li节点后面的所有兄弟节点。并为查找到的兄弟节点增加tmpExample样式。

5、查找指定节点的前一个兄弟节点 prev()
     举例:$('li#tmpBroccoli').prev().addClass('tmpExample');
              查找ID为tmpBroccoli的li节点的前一个兄弟节点。并为查找到的兄弟节点增加tmpExample样式。   

6、查找指定节点的前面所有的兄弟节点 prevAll()
     举例:$('li#tmpBroccoli').prevAll().addClass('tmpExample');
              查找ID为tmpBroccoli的li节点的前面所有的兄弟节点。并为查找到的兄弟节点增加tmpExample样式。
               可以在prevAll()的括号中添加选择器来查找指定条件的兄弟节点。如:prevAll('li.tmpClass'),就是查找当

前节点前面所有类为tmClass的兄弟节点。

7、查找所有符合条件的上级节点 parents()
     举例:$('li#tmpCarrot').parents('div#tmpSelection').addClass('tmpExample');
              查找ID为tmpCarrot的li节点所有id为tmpSelection的div上级节点。并为查找到的节点增加tmpExample样

式。

8、查找上级节点 parent()
     举例:$('li#tmpCarrot').parent().addClass('tmpExample');
              查找ID为tmpCarrot的li节点的上级节点。并为查找到的节点增加tmpExample样式。

9、查找子节点 children()
     举例:$('div.tmpList').children('h4').addClass('tmpExample');
              查找class为tmplist的div下面的子节点中为h4标签的。并为查找到的节点增加tmpExample样式。

10、查找到的节点集合中反选 not()
      举例:$('ul li').not('li.tmpVegetables').addClass('tmpExample');
               查找到的li集合中,除了class为tmpVegetables的节点,都增加一个tmpExample样式。

11、选择节点集合中的片段  slice()
      举例:$('ul li').slice(1,4).addClass('tmpExample');
               查找到的li集合中,选择从第1个(从0计数,第一个其实是第二个)节点开始的,向后4个节点,并为这4个

节点增加tmpExample样式。

12、向查找的结果集中添加节点  add()
      举例:$('ul#tmpAnimals li').add('li#tmpBrocoli,li#tmpPepper').addClass('tmpExample');
               id为tmpAnimals的ul节点下的li节点集,添加id为tmpBrocoli的li节点和添加id 为tmpPepper的li节点。并

将组合后的集合中所有li节点增加tmpExample样式。

13、结果集中选择指定元素 eq()
      举例:$('ul li').eq(10).addClass('tmpExample');
              页面ul下面的li集合中,给第10元素增加tmpExample样式。

Javascript 相关文章推荐
AJAX架构之Dojo篇
Apr 10 Javascript
JQuery validate插件验证用户注册信息
May 11 Javascript
JSONP和批量操作功能的实现方法
Aug 21 Javascript
js仿搜狐视频记录片列表展示效果
May 30 Javascript
vue.js实现数据动态响应 Vue.set的简单应用
Jun 15 Javascript
node.js部署之启动后台运行forever的方法
May 23 Javascript
element-ui 中的table的列隐藏问题解决
Aug 24 Javascript
JavaScript设计模式之命令模式实例分析
Jan 16 Javascript
layer.open 子页面弹出层向父页面传输数据的例子
Sep 26 Javascript
vue 动态设置img的src地址无效,npm run build 后找不到文件的解决
Jul 26 Javascript
vue常用高阶函数及综合实例
Feb 25 Vue.js
一文彻底理解js原生语法prototype,__proto__和constructor
Oct 24 Javascript
基于jquery的一个OutlookBar类,动态创建导航条
Nov 19 #Javascript
非阻塞动态加载javascript广告实现代码
Nov 17 #Javascript
javascript实现的使用方向键控制光标在table单元格中切换
Nov 17 #Javascript
Google AJAX 搜索 API实现代码
Nov 17 #Javascript
jQuery阻止冒泡和HTML默认操作
Nov 17 #Javascript
菜鸟学习JavaScript小实验之函数引用
Nov 17 #Javascript
return false,对阻止事件默认动作的一些测试代码
Nov 17 #Javascript
You might like
如何在PHP程序中防止盗链
2008/04/09 PHP
PHP删除非空目录的函数代码小结
2013/02/28 PHP
php5.3 注意事项说明
2013/07/01 PHP
curl不使用文件存取cookie php使用curl获取cookie示例
2014/01/26 PHP
CodeIgniter删除和设置Cookie的方法
2015/04/07 PHP
如何写php守护进程(Daemon)
2015/12/30 PHP
PHP的RSA加密解密方法以及开发接口使用
2018/02/11 PHP
PHP的new static和new self的区别与使用
2019/11/27 PHP
PHP fopen中文文件名乱码问题解决方案
2020/10/28 PHP
CL vs ForZe BO5 第五场 2.13
2021/03/10 DOTA
javascript中RegExp保留小数点后几位数的方法分享
2013/08/13 Javascript
js与jquery获取父级元素,子级元素,兄弟元素的实现方法
2014/01/09 Javascript
Jquery弹出层插件ThickBox的使用方法
2014/12/09 Javascript
jquery.mobile 共同布局遇到的问题小结
2015/02/10 Javascript
Jquery中$.post和$.ajax的用法小结
2015/04/28 Javascript
js输出数据精确到小数点后n位代码
2016/07/02 Javascript
Bootstrap实现input控件失去焦点时验证
2016/08/04 Javascript
javascript数字验证的实例代码(推荐)
2016/08/20 Javascript
Bootstrap基本插件学习笔记之Tooltip提示工具(18)
2016/12/08 Javascript
bootstrap table服务端实现分页效果
2017/08/10 Javascript
jQuery实现手机号正则验证输入及自动填充空格功能
2018/01/02 jQuery
微信小程序如何获取手机验证码
2018/11/04 Javascript
Python用模块pytz来转换时区
2016/08/19 Python
Python编程实现生成特定范围内不重复多个随机数的2种方法
2017/04/14 Python
Python lambda函数基本用法实例分析
2018/03/16 Python
TensorFlow卷积神经网络之使用训练好的模型识别猫狗图片
2019/03/14 Python
Python3之不使用第三方变量,实现交换两个变量的值
2019/06/26 Python
Django 创建后台,配置sqlite3教程
2019/11/18 Python
浅谈Python 参数与变量
2020/06/20 Python
Python爬虫+tkinter界面实现历史天气查询的思路详解
2021/02/22 Python
人事任命书格式
2014/06/05 职场文书
学习十八大演讲稿
2014/09/15 职场文书
群众路线个人整改方案
2014/10/25 职场文书
村官2015年度工作总结
2015/10/14 职场文书
python学习之panda数据分析核心支持库
2021/05/07 Python
HTML通过表单实现酒店筛选功能
2021/05/18 HTML / CSS