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 相关文章推荐
Prototype使用指南之form.js
Jan 10 Javascript
JavaScript CSS菜单功能 改进版
Dec 20 Javascript
两种WEB下的模态对话框 (asp.net或js的分别实现)
Dec 02 Javascript
原生js和jquery实现图片轮播特效
Apr 23 Javascript
JavaScript获取表格(table)当前行的值、删除行、增加行
Jul 03 Javascript
knockoutjs动态加载外部的file作为component中的template数据源的实现方法
Sep 01 Javascript
JS实现简单拖拽效果
Jun 21 Javascript
看看“疫苗查询”小程序有温度的代码
Jul 31 Javascript
说说Vuex的getters属性的具体用法
Apr 15 Javascript
VUE.CLI4.0配置多页面入口的实现
Nov 25 Javascript
如何解决vue在ios微信&quot;复制链接&quot;功能问题
Mar 26 Javascript
如何在JS文件中获取Vue组件
Sep 16 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+MySQL5.0中文乱码解决方法
2006/11/20 PHP
PHP syntax error, unexpected $end 错误的一种原因及解决
2008/10/25 PHP
PHP基于Closure类创建匿名函数的方法详解
2017/08/17 PHP
php使用curl_init()和curl_multi_init()多线程的速度比较详解
2018/08/15 PHP
JavaScript脚本语言在网页中的简单应用
2007/05/13 Javascript
用AJAX返回HTML片段中的JavaScript脚本
2010/01/04 Javascript
firefox下jquery ajax返回object XMLDocument处理方法
2014/01/26 Javascript
jQuery中index()的用法分析
2014/09/05 Javascript
jQuery中map()方法用法实例
2015/01/06 Javascript
jQuery插件开发的五种形态小结
2015/03/04 Javascript
JavaScript中的Math.sin()方法使用详解
2015/06/15 Javascript
js实现有过渡渐变效果的图片轮播相册(兼容IE,ff)
2016/01/19 Javascript
jquery自定义右键菜单、全选、不连续选择
2016/03/01 Javascript
ionic在开发ios系统微信时键盘挡住输入框的解决方法(键盘弹出问题)
2016/09/06 Javascript
jQuery 表单序列化实例代码
2017/06/11 jQuery
AngularJS中使用three.js的实例详解
2017/07/21 Javascript
vue2.0模拟锚点的实例
2018/03/14 Javascript
koa+jwt实现token验证与刷新功能
2019/05/30 Javascript
[07:38]2014DOTA2国际邀请赛 Newbee顺利挺进胜者组赛后专访
2014/07/15 DOTA
编程语言Python的发展史
2014/09/26 Python
Python中表达式x += y和x = x+y 的区别详解
2017/06/20 Python
ubuntu环境下python虚拟环境的安装过程
2018/01/07 Python
python实现批量文件重命名
2019/10/31 Python
pycharm 更改创建文件默认路径的操作
2020/02/15 Python
什么是python的必选参数
2020/06/21 Python
CSS3的颜色渐变效果的示例代码
2017/09/29 HTML / CSS
墨西哥网上购物:Linio墨西哥
2016/10/20 全球购物
英国高街电视:High Street TV
2018/05/22 全球购物
酒店员工检讨书
2014/02/18 职场文书
境外导游求职信
2014/02/27 职场文书
公路绿化方案
2014/05/12 职场文书
测控技术自荐信
2014/06/05 职场文书
关于读书的活动方案
2014/08/14 职场文书
2016春季幼儿园开学寄语
2015/12/03 职场文书
2016年度创先争优活动总结
2016/04/05 职场文书
标准演讲稿格式结尾应该怎么书写?
2019/07/17 职场文书