jQueryトラバーサル
トラバーサルとは何ですか?
jQuery トラバーサルは「移動(dòng)」を意味し、他の要素との関係に基づいて HTML 要素を「検索」(または選択) するために使用されます。選択範(fàn)囲から開(kāi)始し、目的の要素に到達(dá)するまでこの選択範(fàn)囲に沿って移動(dòng)します。
下の寫(xiě)真は家系図を示しています。 jQuery トラバーサルを使用すると、選択した (現(xiàn)在の) 要素から開(kāi)始して、家系図內(nèi)で上 (祖先)、下 (子孫)、および水平 (兄弟) に簡(jiǎn)単に移動(dòng)できます。この移動(dòng)は DOM のトラバースと呼ばれます。
イラスト分析:
<div> 要素は <ul> 內(nèi)のすべてのコンテンツの祖先です。
<ul>要素は<li>の子要素です
左側(cè)の<li>要素は<span>の子要素です
- 要素の子孫であり、
- の子であり、
- と
- の子であり、
- と
の両方の子孫です。DOM の走査
jQuery には、DOM を走査するためのさまざまなメソッドが用意されています。
トラバーサル手法の最も大きな種類はツリートラバーサル (ツリートラバーサル) です。
の子孫です。學(xué)び続ける2 つの <li> 要素は兄弟です (同じ親要素を持っています)。
右側(cè)の <li> 要素は <b> の親要素、<ul> の子要素、<div> の子孫です。
要素は、右側(cè)の
- の子であり、
の子孫です。
要素は、
||
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文網(wǎng)(php.cn)</title>
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
$("li").each(function(){
alert($(this).text())
});
});
});
</script>
</head>
<body>
<button>輸出每個(gè)列表項(xiàng)的值</button>
<ul>
<li>Coffee</li>
<li>Milk</li>
<li>Soda</li>
</ul>
</body>
</html>