JQuery选择内部div标签

Question

鉴于此HTML

 <div class="list">Item 1
   <div class="hidden">This is the rest of the data</div>
</div>

我只需要选择内部div标签的内容。

我有这个JQuery函数，但我似乎无法进入内部标记。

$( ".list" ).click(function() {
  var htmlString = $( this ).html();
  alert(htmlString)
 });

Answer 1

使用find()：

$( ".list" ).click(function() {
  var htmlString = $( this ).find('div.hidden').html();
  alert(htmlString)
 });

Answer 2

您也可以first()

$( ".list" ).click(function() {
  var htmlString = $( this ).first().html();
  alert(htmlString)
 });

Answer 3

内部div似乎是.list div的第一个孩子，因此可以firstChild()选择。

$( ".list" ).click(function() {
  var htmlString = $( this ).firstChild().html();
  alert(htmlString)
 });

另外，正如你所知道的内部div类，为什么不这样做：

$( ".hidden" ).click(function() {
  var htmlString = $( this ).html();
  alert(htmlString)
 });

另一种解决方案：

$( ".list > div" ).click(function() {
  var htmlString = $( this ).html();
  alert(htmlString)
 });

实际上有很多方法可以解决这个问题，而不是发布每一个问题：D