JQuery中节点遍历方法实例
本文实例讲述了JQuery中节点遍历方法。分享给大家供大家参考。具体如下:
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/>
<title>jQuery节点遍历</title>
<scriptsrc="jquery-1.6.2.min.js"type="text/javascript"></script>
<scripttype="text/javascript">
$(function(){
//-----举例1.获取节点之前的挨着的第一个兄弟元素
//var$divs=$("#div2").prev("div");//只获取div
//ShowArraysID($divs);
//-----举例2.获取节点之前的所有兄弟元素
//var$divs=$("#div2").prevAll("div");//只获取div
//var$divs=$("#div2").prevAll();//获取所有兄弟元素
//ShowArraysID($divs);
//-----举例3.获取节点之后的挨着的第一个兄弟元素
//var$divs=$("#div2").next("div");//只获取divdiv2后紧挨着的是input所以返回零个元素
//ShowArraysID($divs);
//-----举例4.获取节点之后的所有兄弟元素类似prevAll方向相反
//var$divs=$("#div2").nextAll();//获取所有兄弟元素
//ShowArraysID($divs);
//-----举例4.siblings()方法用于获取所有同辈元素(前后都拿到)
//$(".menuitem").siblings("li")。siblings、next等所有能传递选择器的地方能够使用的语法都和$()语法一样。
//var$divs=$("#div2").siblings("div");//获取id为div2前后的所有div元素
//ShowArraysID($divs);
var$divs=$("#div2").siblings();//获取id为div2前后的所有元素
ShowArraysID($divs);
});
functionShowArraysID($jqueryArr){
varoutput="";
for(vari=0;i<$jqueryArr.length;i++){
if(output==""){
output=$jqueryArr.eq(i).attr("id");
}
else{
output+=","+$jqueryArr.eq(i).attr("id");
}
}
alert(output);
}
</script>
</head>
<body>
<divid="div1">我是div1</div>
<inputid="Text3"type="text"value="我是text1"/>
<divid="div2">我是div2</div>
<inputid="txt1"type="text"value="我是text1"/>
<divid="div3">我是div3</div>
<inputid="Text1"type="text"value="我是text2"/>
<divid="div4">我是div4</div>
<inputid="Text2"type="text"value="我是text3"/>
<divid="div5">我是div5</div>
</body>
</html>
希望本文所述对大家的jQuery程序设计有所帮助。