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 相关文章推荐
javascript转换字符串为dom对象(字符串动态创建dom)
May 10 Javascript
javascript椭圆旋转相册实现代码
Jan 16 Javascript
js操作label给label赋值及取label的值示例
Nov 07 Javascript
jQuery(js)获取文字宽度(显示长度)示例代码
Dec 31 Javascript
jQuery解析XML文件同时动态增加js文件的方法
Jun 01 Javascript
javascript引用类型之时间Date和数组Array
Aug 27 Javascript
jQuery EasyUI 获取tabs的实例解析
Dec 06 Javascript
JavaScript之浏览器对象_动力节点Java学院整理
Jul 03 Javascript
微信小程序开发之IOS和Android兼容的问题
Sep 26 Javascript
js 两个日期比较相差多少天的实例
Oct 19 Javascript
js中apply与call简单用法详解
Nov 06 Javascript
angular中两种表单的区别(响应式和模板驱动表单)
Dec 06 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字符编码转换之gb2312转为utf8
2013/10/28 PHP
PHP SplObjectStorage使用实例
2015/05/12 PHP
基础的WordPress插件制作教程
2015/11/24 PHP
关于PHP中Session文件过多的问题及session文件保存位置
2016/03/17 PHP
jQuery的强大选择器小结
2009/12/27 Javascript
点弹代码 点击页面任何位置都可以弹出页面效果代码
2012/09/17 Javascript
javascript实现博客园页面右下角返回顶部按钮
2015/02/22 Javascript
分享使用AngularJS创建应用的5个框架
2015/12/05 Javascript
jQuery实现的超简单点赞效果实例分析
2015/12/31 Javascript
JS中如何比较两个Json对象是否相等实例代码
2016/07/13 Javascript
全面了解javascript中的错误处理机制
2016/07/18 Javascript
Angularjs CURD 详解及实例代码
2016/09/14 Javascript
JS去除字符串中空格的方法
2017/02/14 Javascript
vue.js实现数据动态响应 Vue.set的简单应用
2017/06/15 Javascript
vue的安装及element组件的安装方法
2018/03/09 Javascript
vue实现的上拉加载更多数据/分页功能示例
2019/05/25 Javascript
如何实现双向绑定mvvm的原理实现
2019/05/28 Javascript
浅谈JSON5解决了JSON的两大痛点
2020/12/14 Javascript
python使用xauth方式登录饭否网然后发消息
2014/04/11 Python
Jupyter Notebook 文件默认目录的查看以及更改步骤
2020/04/14 Python
使用pandas库对csv文件进行筛选保存
2020/05/25 Python
聊聊python中的循环遍历
2020/09/07 Python
CSS3 Calc实现滚动条出现页面不跳动问题
2017/09/14 HTML / CSS
经典优秀个人求职自荐信格式
2013/09/25 职场文书
人力资源管理专业毕业生推荐信
2013/11/07 职场文书
应届毕业生的自我鉴定
2013/11/13 职场文书
护士实习生自我鉴定范文
2013/12/10 职场文书
出国留学介绍信
2014/01/13 职场文书
演讲比赛获奖感言
2014/02/02 职场文书
2016应届大学生自荐信模板
2016/01/28 职场文书
python使用openpyxl库读写Excel表格的方法(增删改查操作)
2021/05/02 Python
Python Django搭建文件下载服务器的实现
2021/05/10 Python
Linux系统下MySQL配置主从分离的步骤
2022/03/21 MySQL
疑《守望先锋2》A测截图泄露 或将推出新模式、新界面
2022/04/03 其他游戏
java高级用法JNA强大的Memory和Pointer
2022/04/19 Java/Android
Win10本地连接不见了怎么恢复? win10系统电脑本地连接不见了解决方法
2023/01/09 数码科技