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 相关文章推荐
JavaScript实现动态增加文件域表单
Feb 12 Javascript
javascript使用activex控件的代码
Jan 27 Javascript
jquery图片播放浏览插件prettyPhoto使用详解
Dec 19 Javascript
jQuery对象初始化的传参方式
Feb 26 Javascript
基于JS实现PHP的sprintf函数实例
Nov 14 Javascript
分享12个非常实用的JavaScript小技巧
May 11 Javascript
js 弹出对话框(遮罩)透明,可拖动的简单实例
Jul 11 Javascript
利用ES6语法重构React组件详解
Mar 02 Javascript
详解如何在nuxt中添加proxyTable代理
Aug 10 Javascript
微信小程序获取音频时长与实时获取播放进度问题
Aug 28 Javascript
使用vue2实现带地区编号和名称的省市县三级联动效果
Nov 05 Javascript
javascript 关于赋值、浅拷贝、深拷贝的个人理解
Nov 01 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
全国FM电台频率大全 - 13 福建省
2020/03/11 无线电
php上传图片到指定位置路径保存到数据库的具体实现
2013/12/30 PHP
PHP mongodb操作类定义与用法示例【适合mongodb2.x和mongodb3.x】
2018/06/16 PHP
实例分析PHP将字符串转换成数字的方法
2019/01/27 PHP
javascript 折半查找字符在数组中的位置(有序列表)
2010/12/09 Javascript
jquery实现侧边弹出的垂直导航
2014/12/09 Javascript
JS跨域交互(jQuery+php)之jsonp使用心得
2016/07/01 Javascript
jQuery事件处理的特征(事件命名机制)
2016/08/23 Javascript
Ajax实现不刷新取最新商品
2017/03/01 Javascript
ios设备中angularjs无法改变页面title的解决方法
2018/09/13 Javascript
Vue Echarts实现可视化世界地图代码实例
2019/05/07 Javascript
JS获取表格视图所选行号的ids过程解析
2020/02/21 Javascript
vue倒计时刷新页面不会从头开始的解决方法
2020/03/03 Javascript
[01:12:40]DOTA2-DPC中国联赛 正赛 DLG vs XG BO3 第三场 1月25日
2021/03/11 DOTA
简要讲解Python编程中线程的创建与锁的使用
2016/02/28 Python
python计算两个数的百分比方法
2018/06/29 Python
深度辨析Python的eval()与exec()的方法
2019/03/26 Python
在python Numpy中求向量和矩阵的范数实例
2019/08/26 Python
python线程信号量semaphore使用解析
2019/11/30 Python
解决Tensorboard 不显示计算图graph的问题
2020/02/15 Python
python检查目录文件权限并修改目录文件权限的操作
2020/03/11 Python
python 使用cx-freeze打包程序的实现
2020/03/14 Python
pandas分组聚合详解
2020/04/10 Python
解决paramiko执行命令超时的问题
2020/04/16 Python
python numpy矩阵信息说明,shape,size,dtype
2020/05/22 Python
Python实现Keras搭建神经网络训练分类模型教程
2020/06/12 Python
在keras里面实现计算f1-score的代码
2020/06/15 Python
Pytorch实现将模型的所有参数的梯度清0
2020/06/24 Python
大数据分析用java还是Python
2020/07/06 Python
python+requests接口自动化框架的实现
2020/08/31 Python
利用 CSS3 实现的无缝轮播功能代码
2017/09/25 HTML / CSS
意大利运动服减价商店:ScontoSport
2020/03/10 全球购物
感恩父母的演讲稿
2014/05/06 职场文书
优秀纪检干部材料
2014/08/27 职场文书
python将图片转为矢量图的方法步骤
2021/03/30 Python
速龙x4-860k处理器相当于i几
2022/04/20 数码科技