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 模拟JQuery的Ready方法实现并出现的问题
Dec 06 Javascript
JavaScript 打地鼠游戏代码说明
Oct 12 Javascript
extjs 3.31 TreeGrid实现静态页面加载json到TreeGrid里面
Apr 02 Javascript
jquery图片放大功能简单实现
Aug 01 Javascript
JQ技术实现注册页面带有校验密码强度
Jul 27 Javascript
Jquery实现简单的轮播效果(代码管用)
Mar 14 Javascript
JS实现拖拽的方法分析
Dec 20 Javascript
详解Vuejs2.0之异步跨域请求
Apr 20 Javascript
Vue.js实现一个SPA登录页面的过程【推荐】
Apr 29 Javascript
Vue实现左右菜单联动实现代码
Aug 12 Javascript
Angular使用Restful的增删改
Dec 28 Javascript
在vue中使用echarts(折线图的demo,markline用法)
Jul 20 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
模仿OSO的论坛(四)
2006/10/09 PHP
PHP面向对象分析设计的61条军规小结
2010/07/17 PHP
php安全开发 添加随机字符串验证,防止伪造跨站请求
2013/02/14 PHP
PHP过滤★等特殊符号的正则
2014/01/27 PHP
php下foreach提示Warning:Invalid argument supplied for foreach()的解决方法
2014/11/11 PHP
Laravel 5.0 发布 新版本特性详解
2015/02/10 PHP
php判断文件夹是否存在不存在则创建
2015/04/09 PHP
php 后端实现JWT认证方法示例
2018/09/04 PHP
PHP使用JpGraph绘制折线图操作示例【附源码下载】
2019/10/18 PHP
使两个iframe的高度与内容自适应,且相等
2006/11/20 Javascript
JQuery each打印JS对象的方法
2013/11/13 Javascript
jQuery判断数组是否包含了指定的元素
2015/03/10 Javascript
jQuery中判断对象是否存在的方法汇总
2016/02/24 Javascript
EXT中单击button按钮grid添加一行(光标位置可设置)的实例代码
2016/06/02 Javascript
jQuery实现左侧导航模块的显示与隐藏效果
2016/07/04 Javascript
jQuery web 组件 后台日历价格、库存设置的代码
2016/10/14 Javascript
使用ionic切换页面卡顿的解决方法
2016/12/16 Javascript
javascript中undefined的本质解析
2019/07/31 Javascript
React+TypeScript+webpack4多入口配置详解
2019/08/08 Javascript
js数据类型转换与流程控制操作实例分析
2019/12/18 Javascript
Vue+abp微信扫码登录的实现代码示例
2020/01/06 Javascript
[44:47]Ti4 循环赛第三日 iG vs NaVi
2014/07/12 DOTA
Python中条件选择和循环语句使用方法介绍
2013/03/13 Python
python概率计算器实例分析
2015/03/25 Python
深入理解python try异常处理机制
2016/06/01 Python
Python 实现王者荣耀中的敏感词过滤示例
2019/01/21 Python
浅谈matplotlib默认字体设置探索
2021/02/03 Python
pycharm配置python 设置pip安装源为豆瓣源
2021/02/05 Python
欧舒丹加拿大官网:L’Occitane加拿大
2017/10/29 全球购物
Toppik顶丰增发纤维官网:解决头发稀疏
2017/12/30 全球购物
捷克家具销售网站:SCONTO Nábytek
2020/01/02 全球购物
出资证明书范本(标准版)
2014/09/24 职场文书
个人四风问题对照检查材料
2014/10/01 职场文书
天坛导游词
2015/02/02 职场文书
义诊活动通知
2015/04/24 职场文书
2015年学校消防安全工作总结
2015/10/14 职场文书