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 相关文章推荐
判断字符串的长度(优化版)中文占两个字符
Oct 30 Javascript
AngularJS入门教程之学习环境搭建
Dec 06 Javascript
浅谈Javascript中substr和substring的区别
Sep 30 Javascript
浅析JavaScript函数的调用模式
Aug 10 Javascript
BootStrap日期控件在模态框中选择时间下拉菜单无效的原因及解决办法(火狐下不能点击)
Aug 18 Javascript
基于SpringMVC+Bootstrap+DataTables实现表格服务端分页、模糊查询
Oct 30 Javascript
domReady的实现案例
Nov 23 Javascript
微信小程序 天气预报开发实例代码源码
Jan 20 Javascript
详解JS模块导入导出
Dec 20 Javascript
Vue项目组件化工程开发实践方案
Jan 09 Javascript
微信小程序车牌号码模拟键盘输入功能的实现代码
Nov 11 Javascript
详解vue几种主动刷新的方法总结
Feb 19 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
Amazon Prime Video平台《无限住人 -IMMORTAL-》2020年开始TV放送!
2020/03/06 日漫
使用sockets:从新闻组中获取文章(二)
2006/10/09 PHP
图文介绍PHP添加Redis模块及连接
2015/07/28 PHP
Yii中特殊行为ActionFilter的使用方法示例
2020/10/18 PHP
jquery validate.js表单验证的基本用法入门
2010/05/13 Javascript
js定时调用方法成功后并停止调用示例
2014/04/08 Javascript
21个JavaScript事件(Events)属性汇总
2014/12/02 Javascript
详解Node.js包的工程目录与NPM包管理器的使用
2016/02/16 Javascript
利用JQuery写一个简单的异步分页插件
2016/03/07 Javascript
微信小程序侧边栏滑动特效(左右滑动)
2017/01/23 Javascript
jQuery实现菜单栏导航效果
2017/08/15 jQuery
JS交互点击WKWebView中的图片实现预览效果
2018/01/05 Javascript
JavaScript显式数据类型转换详解
2019/03/18 Javascript
vue学习笔记之slot插槽基本用法实例分析
2020/02/01 Javascript
微信小程序报错: thirdScriptError的错误问题
2020/06/19 Javascript
python实现微信自动回复功能
2018/04/11 Python
Python处理时间日期坐标轴过程详解
2019/06/25 Python
Pycharm 使用 Pipenv 新建的虚拟环境(图文详解)
2020/04/16 Python
Python文件夹批处理操作代码实例
2020/07/21 Python
美国指甲油品牌:Deco Miami
2017/01/30 全球购物
英国文具、办公用品和科技商店:Ryman
2018/09/27 全球购物
Linux文件操作命令都有哪些
2015/02/27 面试题
如果重写了对象的equals()方法,需要考虑什么
2014/11/02 面试题
网络工程与软件技术毕业生自荐信
2013/09/24 职场文书
大学生职业生涯规划范文
2014/01/08 职场文书
工作表现评语
2014/01/19 职场文书
气象学专业个人求职信
2014/04/22 职场文书
英语教研活动总结
2014/07/02 职场文书
党员剖析材料范文
2014/12/18 职场文书
培训通知
2015/04/17 职场文书
2015年世界环境日活动方案
2015/05/05 职场文书
HTML基础-标签分类(闭合标签,空标签,块级元素,行内元素,行级块元素,可替换元素)
2021/03/31 HTML / CSS
Python&Matlab实现灰狼优化算法的示例代码
2022/03/21 Python
Python使用PyYAML库读写yaml文件的方法
2022/04/06 Python
CentOS下安装Jenkins的完整步骤
2022/04/07 Servers
Python时间操作之pytz模块使用详解
2022/06/14 Python