網頁

2017/11/27

jQuery 選取child element 子元素

jQuery如要選取某個元素的child element(子元素),可以使用jQuery( selector [, context ] )


selector是你要選取的子元素,而context則是該子元素所在的元素。

例如下面範例要選取<div id="div2">中的<p>元素。

<div id="div1">
  <p>Hello</p>
</div>
<div id="div2">
  <p>World</p>
</div>

<script>
console.log($('p', '#div2').text()); // World
</script>

使用.find()也有同樣的效果,例如

$('#div2').find('p').text();

也可使用jQuery( "parent child" ),例如

$('#div2 p').text();

或是jQuery( "parent > child" ),例如

$('#div2 > p').text();

jQuery( "parent child" )jQuery( "parent > child" )的差別是,
jQuery( "parent child" )會選取parent下每一層的子元素;
jQuery( "parent > child" )僅選取parent下一層的子元素。



1 則留言: