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程序设计有所帮助。