jQuery 7 节点遍历

jQuery提供了非常好的方法去遍历节点 :

next("过滤元素"):用于获取节点之后紧临的第一个同辈元素。如：$(".myclass").next("div")->获取所有引用myclass样式后的第一个div元素。

nextAll("过滤元素"):用于获取节点之后的所有同辈元素。$(".myclass").nextAll("div")->获取所有引用myclass样式后的所有div元素.

siblings("过滤元素"):用于获取所有的兄弟（同辈）元素. $(".myclass").siblings("li")->获取所有引用myclass样式的兄弟li节点

实例1（运行时把jQuery代码一个个执行就可看到效果）

<html xmlns="http://www.w3.org/1999/xhtml">
<head><title></title><script src="JScript/jquery-1.9.1.js" type="text/javascript"></script>
<script type="text/javascript">$(function () {$("div").click(function () {alert($(this).next("div").text());  //显示同辈下个节点的名称alert($(this).next().text()); //显示div后面第一个p的值，如果div后没有p,则它显示空alert($(this).nextAll("div").text());//显示所有选择之后div的值$.each($(this).nextAll(), function () {$(this).css("background", "red"); //设置所选择的后面的所有元素css
                        })$(this).nextAll().css("background", "red");//自动迭代$(this).css("background", "red"); $(this).siblings("div").css("background", "green"); //点选的为红色，其它为绿色$(this).css("background", "red").siblings("div").css("background","white");alert($(this).siblings("p").text());//所有同辈元素，不加p过滤器，就会把所有的加上
        })});</script>
</head>
<body>
<div>aaaa</div>
<div>bbb</div>
<div>cccc</div>
<p>p1</p>
<p>p2</p>
<p>p3</p>
<div>
dddd<input type="text" value="hihi" /><input type="button" value="click" />
</div>
<div>eee</div>
<div>fffff</div>
</body>
</html>

转载于:https://www.cnblogs.com/yagzh2000/archive/2013/05/25/3098820.html

jQuery 7 节点遍历相关推荐

【笔记】jQuery源码（节点遍历）
前言内容主要是跟着慕课网上的jQuery源码解析系列课程以及自己的实践+理解来写的,可能会有错误,欢迎指出^_^. 节点遍历遍历的接口可以分为4个类型: 祖先同胞兄弟后代过滤所以这个章节的 ...
jQuery（九）：节点遍历
一.遍历子元素 children()方法可以用来获取元素的所有子元素,语法如下: 示例: <!DOCTYPE html> <html lang="en"> ...
Jquery 里的节点遍历(next(),perv(),nextAll(),prevAll())
1.节点遍历 <div> <ul> <li>111</li> <li>222</li> <li>333</li ...
jquery 元素节点操作 - 创建节点、插入节点、删除节点
jquery的节点操作说明前面的篇章对于jquery的元素操作大部分是使用html()的方式来操作,这种直接使用字符串创建的方式也是性能最高的. 使用html()操作节点首先编写一个div包含一个 ...
JQuery-学习笔记05【高级——JQuery动画和遍历】
Java后端学习路线笔记汇总表[黑马程序员] JQuery-学习笔记01[基础--JQuery基础]--[day01] JQuery-学习笔记02[基础--JQuery选择器] JQuery-学习 ...
事件冒泡、事件委托、jQuery元素节点操作、滚轮事件与函数节流
一.事件冒泡定义事件冒泡是指在一个对象触发某类事件(比如单击onclick事件),如果此对象定义了此事件的处理程序,那么此事件就会调用这个处理程序,如果没有定义此事件处理程序或者事件返回true,那 ...
jquery 遍历java对象的属性_用jquery each标签遍历java list对象
最近在做tms管理系统(物流管理软件),遇到这样一个场景: 运单对应多个货物信息(我们这里只对应3个货物信息,但大部分情况下,只有1个货物信息),我需要编辑也就是修改该运单,那么带出该运单一对多的货物 ...
原生js使用forEach()与jquery使用each遍历数组，return false 的区别
原生js使用forEach()与jquery使用each()遍历数组,return false 的区别: 1.使用each()遍历数组a,如下: var a=[20,21,22,23,24];$.ea ...
jquery元素节点操作
jquery元素节点操作创建节点 var $div = $('<div>'); var $div2 = $('<div>这是一个div元素</div>'); 插入 ...

jQuery 7 节点遍历

jQuery 7 节点遍历相关推荐

最新文章

热门文章