jquery遍历函数siblings()
生活随笔
收集整理的這篇文章主要介紹了
jquery遍历函数siblings()
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
本文轉自:http://blog.csdn.net/cui_angel/article/details/7896883
siblings([expr])
得到所有匹配元素集合中各個元素的所有兄弟元素集合。返回匹配元素集合
<span style="font-size:18px;"> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <script src="http://code.jquery.com/jquery-latest.js"></script> <script> $(document).ready(function(){ var len = $(".hilite").siblings() .css("color", "red") .length; $("b").text(len); }); </script> <style> ul { float:left; margin:5px; font-size:16px; font-weight:bold; } p { color:blue; margin:10px 20px; font-size:16px; padding:5px; font-weight:bolder; } .hilite { background:yellow; } </style> </head> <body> <ul> <li>One</li> <li>Two</li> <li class="hilite">Three</li> <li>Four</li> </ul> <ul> <li>Five</li> <li>Six</li> <li>Seven</li> </ul> <ul> <li>Eight</li> <li class="hilite">Nine</li> <li>Ten</li> <li class="hilite">Eleven</li> </ul> <p>Unique siblings: <b></b></p> </body> </html> </span><span style="font-size:18px;"> <span style="font-size: medium;"><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <script src="http://code.jquery.com/jquery-latest.js"></script> <script> $(document).ready(function(){ var len = $(".hilite").siblings() .css("color", "red") .length; $("b").text(len); }); </script> <style> ul { float:left; margin:5px; font-size:16px; font-weight:bold; } p { color:blue; margin:10px 20px; font-size:16px; padding:5px; font-weight:bolder; } .hilite { background:yellow; } </style> </head> <body> <ul> <li>One</li> <li>Two</li> <li class="hilite">Three</li> <li>Four</li> </ul> <ul> <li>Five</li> <li>Six</li> <li>Seven</li> </ul> <ul> <li>Eight</li> <li class="hilite">Nine</li> <li>Ten</li> <li class="hilite">Eleven</li> </ul> <p>Unique siblings: <b></b></p> </body> </html> </span> </span>
$(".hilite").siblings()
將得到包含特殊樣式‘hilite’元素的所有兄弟元素集合。以下是匹配元素集合
<li>One</li>
<li>Two</li>
<li>Four</li>
<li>Eight</li>
<li class="hilite">Nine</li>
<li>Ten</li>
<li class="hilite">Eleven</li>
注意:上面之所以會同時出現<li class="hilite">Nine</li>和<li class="hilite">Eleven</li>,是因為他們彼此之間都是各自的兄弟元素,所以在使用siblings()方法時會把彼此都給讀取出來。
總結
以上是生活随笔為你收集整理的jquery遍历函数siblings()的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: jQuery中blur和focus事件的
- 下一篇: js笔记之Math random()、c