Question

您好我有一个HTML代码如下

<body>
     <div class="dadas"><div class="col-md-12"><span>Hiiiii</span></div></div>
     <div class="ss"><div class="col-md-12"><span>User</span></div></div>
     <div class="sd"><div class="col-md-12"><span>This </span></div></div>
     <div class="ae"><div class="col-md-12"><span>Is an </span></div></div>
     <div class="asd"><div class="col-md-12"><span>Example</span></div></div>
</body>

我试图按照这样的身体来检索divs

1 = <div class="dadas"><div class="col-md-12"><span>Hiiiii</span></div></div>
2 = <div class="ss"><div class="col-md-12"><span>User</span></div></div>
3 = <div class="sd"><div class="col-md-12"><span>This </span></div></div>
4 = <div class="ae"><div class="col-md-12"><span>Is an </span></div></div>
5 = <div class="asd"><div class="col-md-12"><span>Example</span></div></div>

我正在尝试各种功能：

$($("body div")).map(function(){ alert($(this).html())})

但我没有得到正确的输出。

Answer 1

您的选择器出现问题，您只需要提取div元素的直接body子元素而不是所有后代div元素，因此请使用child-selector代替descendant selector。

另外，要获取div本身的html标记，您需要使用outerHTML属性。

＆＃13;

$($("body > div")).each(function() {
  snippet.log(this.outerHTML)
})

＆＃13;

<!-- Provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 -->
<script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="dadas">
  <div class="col-md-12"><span>Hiiiii</span>
  </div>
</div>
<div class="ss">
  <div class="col-md-12"><span>User</span>
  </div>
</div>
<div class="sd">
  <div class="col-md-12"><span>This </span>
  </div>
</div>
<div class="ae">
  <div class="col-md-12"><span>Is an </span>
  </div>
</div>
<div class="asd">
  <div class="col-md-12"><span>Example</span>
  </div>
</div>

＆＃13;

Answer 2

您只想使用：

$("body > div")

仅选择body的直接祖先。

当你只使用$("body div")时，它会匹配身体的所有div后代，无论它们是如何嵌套的。

需要检索正文中的所有主要div

2 个答案: