Jquery遍历节点的方法小集


Posted in Javascript onJanuary 22, 2014

本文给大家带来Query遍历方法的总结,需要的朋友可以参考下,希望能帮助到大家。下面跟随小编一起来看一下吧。
函数 描述

.add() 将元素添加到匹配元素的集合中。
.andSelf() 把堆栈中之前的元素集添加到当前集合中。
.children() 获得匹配元素集合中每个元素的所有子元素。
.closest() 从元素本身开始,逐级向上级元素匹配,并返回最先匹配的祖先元素。
.contents() 获得匹配元素集合中每个元素的子元素,包括文本和注释节点。
.each() 对 jQuery 对象进行迭代,为每个匹配元素执行函数。
.end() 结束当前链中最近的一次筛选操作,并将匹配元素集合返回到前一次的状态。
.eq() 将匹配元素集合缩减为位于指定索引的新元素。
.filter() 将匹配元素集合缩减为匹配选择器或匹配函数返回值的新元素。
.find() 获得当前匹配元素集合中每个元素的后代,由选择器进行筛选。
.first() 将匹配元素集合缩减为集合中的第一个元素。
.has() 将匹配元素集合缩减为包含特定元素的后代的集合。
.is() 根据选择器检查当前匹配元素集合,如果存在至少一个匹配元素,则返回 true。
.last() 将匹配元素集合缩减为集合中的最后一个元素。
.map() 把当前匹配集合中的每个元素传递给函数,产生包含返回值的新 jQuery 对象。
.next() 获得匹配元素集合中每个元素紧邻的同辈元素。
.nextAll() 获得匹配元素集合中每个元素之后的所有同辈元素,由选择器进行筛选(可选)。
.nextUntil() 获得每个元素之后所有的同辈元素,直到遇到匹配选择器的元素为止。
.not() 从匹配元素集合中删除元素。
.offsetParent() 获得用于定位的第一个父元素。
.parent() 获得当前匹配元素集合中每个元素的父元素,由选择器筛选(可选)。
.parents() 获得当前匹配元素集合中每个元素的祖先元素,由选择器筛选(可选)。
.parentsUntil() 获得当前匹配元素集合中每个元素的祖先元素,直到遇到匹配选择器的元素为止。
.prev() 获得匹配元素集合中每个元素紧邻的前一个同辈元素,由选择器筛选(可选)。
.prevAll() 获得匹配元素集合中每个元素之前的所有同辈元素,由选择器进行筛选(可选)。
.prevUntil() 获得每个元素之前所有的同辈元素,直到遇到匹配选择器的元素为止。
.siblings() 获得匹配元素集合中所有元素的同辈元素,由选择器筛选(可选)。
.slice() 将匹配元素集合缩减为指定范围的子集。

测试代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html;charset=GBK"> 
<link rel="stylesheet" type="text/css" href="table.css"> 
<title></title> 
<script src="../jquery-1.7.2.js" type="text/javascript"></script> 
<style type="text/css"> 
</style> 
<script type="text/javascript"> 
$(function() 
{ 
//next()查找下一个紧邻的节点next("#x")查找下一个紧邻的id为x的节点 
$("#d4").next().css("background-color","red"); 
//nextAll()之后的所有节点.之后的所有的div标签nextAll("div") 
$("#d4").nextAll().css("background-color","red"); 
//之前的紧邻节点 
$("#d4").prev().css("background-color","red"); 
//之前的所有节点 
$("#d4").prevAll().css("background-color","red"); 
//查找所有的兄弟节点 
$("#d4").siblings().css("background-color","red"); 
//查找本节点和本节点之后的节点,end()返回上一次jQuery对象被破坏之前的状态 
$("#d4").nextAll().css("background-color","red").end().css("background-color","red"); 
$("#d4").nextAll().andSelf().css("background-color","red"); 
$("#d4").nextAll().andSelf().end().css("background-color","red"); 
}); 
</script> 
</head> 
<body> 
<div>11111111</div> 
<div>22222222</div> 
<div>33333333</div> 
<div id="d4">44444444</div> 
<p>55555555</p> 
<div>66666666</div> 
<div>77777777</div> 
<div>88888888</div> 
<div>99999999</div> 
</body> 
</html>

大家可以测试一下,对学习很有帮助。

Javascript 相关文章推荐
js DOM的学习笔记
Dec 22 Javascript
extjs ColumnChart设置不同的颜色实现代码
May 17 Javascript
Jquery实现显示和隐藏的4种简单方式
Aug 28 Javascript
js中通过split函数分割字符串成数组小例子
Sep 21 Javascript
写出高效jquery代码的19条指南
Mar 19 Javascript
js中函数调用的两种常用方法使用介绍
Jul 17 Javascript
javascript变量声明实例分析
Apr 25 Javascript
Angularjs的ng-repeat中去除重复数据的方法
Aug 05 Javascript
AngularJS实现网站换肤实例
Feb 19 Javascript
浅析jsopn跨域请求原理及cors(跨域资源共享)的完美解决方法
Feb 06 Javascript
JavaScript数组特性与实践应用深入详解
Dec 30 Javascript
JavaScript实现烟花绽放动画效果
Aug 04 Javascript
Jquery如何实现点击时高亮显示代码
Jan 22 #Javascript
用Jquery.load载入页面实现局部刷新
Jan 22 #Javascript
使用jquery局部刷新(jquery.load)从数据库取出数据
Jan 22 #Javascript
在JS中如何调用JSP中的变量
Jan 22 #Javascript
ExtJS如何设置与获取radio控件的选取状态
Jan 22 #Javascript
JS中的数组的sort方法使用示例
Jan 22 #Javascript
禁止拷贝网页内容的js代码
Jan 22 #Javascript
You might like
PHP函数eval()介绍和使用示例
2014/08/20 PHP
PHP+jquery+CSS制作头像登录窗(仿QQ登陆)
2016/10/20 PHP
PHP连接MYSQL数据库的3种常用方法
2017/02/27 PHP
PHP设计模式之原型模式定义与用法详解
2018/04/03 PHP
基于JavaScript实现继承机制之调用call()与apply()的方法详解
2013/05/07 Javascript
jQuery中has()方法用法实例
2015/01/06 Javascript
Vue.js基础知识汇总
2016/04/27 Javascript
Javascrip实现文字跳动特效
2016/11/27 Javascript
详解微信小程序中的页面代码中的模板的封装
2017/10/12 Javascript
vue v-model动态生成详解
2018/06/30 Javascript
React Component存在的几种形式详解
2018/11/06 Javascript
从零开始实现Vue简单的Toast插件
2018/12/03 Javascript
Vue-input框checkbox强制刷新问题
2019/04/18 Javascript
解决VUE-Router 同一页面第二次进入不刷新的问题
2020/07/22 Javascript
基于JavaScript的数据结构队列动画实现示例解析
2020/08/06 Javascript
[50:59]2018DOTA2亚洲邀请赛 4.7 总决赛 LGD vs Mineski第四场
2018/04/10 DOTA
Python编程实现使用线性回归预测数据
2017/12/07 Python
python 读取DICOM头文件的实例
2018/05/07 Python
Python+OpenCV感兴趣区域ROI提取方法
2019/01/10 Python
python中的列表与元组的使用
2019/08/08 Python
pytorch中torch.max和Tensor.view函数用法详解
2020/01/03 Python
Django import export实现数据库导入导出方式
2020/04/03 Python
Python分析微信好友性别比例和省份城市分布比例的方法示例【基于itchat模块】
2020/05/29 Python
Keras load_model 导入错误的解决方式
2020/06/09 Python
详解python tkinter包获取本地绝对路径(以获取图片并展示)
2020/09/04 Python
Python系统公网私网流量监控实现流程
2020/11/23 Python
使用javascript和HTML5 Canvas画的四渐变色播放按钮效果
2014/04/10 HTML / CSS
倩碧美国官网:Clinique美国
2016/07/20 全球购物
Sixt美国租车:高端豪华车型自驾体验
2017/09/02 全球购物
iHerb中文官网:维生素、保健品和健康产品
2018/11/01 全球购物
大学生年度自我鉴定
2013/10/31 职场文书
争论的故事教学反思
2014/02/06 职场文书
最美乡村医生事迹材料
2014/06/02 职场文书
贷款委托书怎么写
2014/08/02 职场文书
收银员岗位职责范本
2015/04/07 职场文书
分享几种python 变量合并方法
2022/03/20 Python