时间戳

首页 > 解决方案 > 如何获取特定的html元素

jquery - 如何获取特定的html元素

问题描述

我只需要 .foo 中的图像标签，而不是所有的 HTML。我摆弄了 filter()、children()、find()，但我只是不知道如何去做我需要做的事情。有人可以帮忙吗？

$modules = 
$('.foo').map(function() {
      return $(this).html();
  }).get().join("<br>");

  alert($modules);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="foo">
    <h5>Text</h5>
    <div class="remove">X</div>
    <img class="image" src="img.png">
</div>
<div class="foo">
    <h5>Text2</h5>
    <div class="remove">X</div>
    <img class="image" src="img2.png">
    <h5>Text3</h5>
    <div class="remove">X</div>
    <img class="image" src="img3.png">
</div>
<div class="foo">
    <h5>Text4</h5>
    <div class="remove">X</div>
    <img class="image" src="img4.png">
</div>

标签： jqueryhtml

解决方案

您需要使用.prop()方法自己获取img标签，如下所示：

.prop('outerHTML');

首先使用选择器获取图像标签的集合'.foo img'，然后获取它们的outerHTML属性。

这是一个解决方案

$modules = 
$('.foo img').map(function() {
      return $(this).prop('outerHTML');
  }).get().join("<br>");

  alert($modules);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="foo">
    <h5>Text</h5>
    <div class="remove">X</div>
    <img class="image" src="img.png">
</div>
<div class="foo">
    <h5>Text2</h5>
    <div class="remove">X</div>
    <img class="image" src="img2.png">
    <h5>Text3</h5>
    <div class="remove">X</div>
    <img class="image" src="img3.png">
</div>
<div class="foo">
    <h5>Text4</h5>
    <div class="remove">X</div>
    <img class="image" src="img4.png">
</div>

推荐阅读