jquery 从中选择父项，然后选择其子项

Question

我需要 select 'this' 元素的父元素然后它是子元素你能看看我的代码是否正确吗？

$(this).click(function(){
  $(this).parent('li').child('p').toggle();
  $(this).not(this).parent('li').child('p').toggle('hide');
});

这实际上是 html 看起来有点像这样

<ul>
  <li><header>Header 1</header><p>Content 1</p></li>
  <li><header>Header 2</header><p>Content 2</p></li>
</ul>

你能解释一下脚本是否正确吗？

Answer 1

var $contents = $("ul p"); // get 'em all! (and use class to be more specific)

$('header').click(function(){
  var $myContent = $(this).closest('li').find('p'); // this content
  $contents.not($myContent).hide();                 // hide all other
  $myContent.toggle();                              // this content toggle
});

ul p{display:none;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
  <li><header>Header 1</header><p>Content 1</p></li>
  <li><header>Header 2</header><p>Content 2</p></li>
  <li><header>Header 3</header><p>Content 3</p></li>
</ul>

jquery 从中选择父项，然后选择其子项

jquery selecting parent from this and then its child

jquery

parent

this

parent-child