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>