Question

我想从index.html中加载所有在变量中分配了指定类的表元素。不幸的是，HTML的第一行无法正确加载。

我的HTML （一个表的示例，通常有几个表）：

<!-- More HTML stuff -->
<table class="class_TopTable table" id="id_TopTable">
  <tr>
    <td>
      <button id="id_Remove">Remove 1</button>
    </td>
    <td>
      <div id="id_Title"><B>Title 1</B></div>
      <div id="id_Content">Content 1</div>
    </td>
  </tr>
</table>
<!-- More HTML stuff -->

我的Java语言：

var all_class_TopTable = "";
$('.class_TopTable').each(function(){
      all_class_TopTable += $(this).html();
})

运行此JS后，all_class_TopTable的变量包含以下HTML：

<tbody>
  <tr>
    <td>
      <button id="id_Remove">Remove 1</button>
    </td>
    <td>
      <div id="id_Title"><B>Title 1</B></div>
      <div id="id_Content">Content 1</div>
    </td>
  </tr>
</tbody>

第一行与我的实际html不同。我希望在<table class="class_TopTable table" id="id_TopTable">的开头和结尾</table>的结尾。

但是结果是在<tbody>的开头和</tbody>的结尾。

我怎么了？

Answer 1

您将获得table节点的内部 HTML，其中不包括table节点本身。

您可以将所有内容包装在div中，然后获取其html：

var all_class_TopTable = $('<div>').append($('.class_TopTable').clone()).html();

Answer 2

您可以使用let countryItems = this.state.countries.map(country => ({ value: country.id, label: country.country_name });属性来捕获元素本身及其后代。

outerHTML

由于all_class_TopTable += $(this)[0].outerHTML;方法仅捕获其后代，因此将其用html包装。

JS / jQuery-如何在变量中加载特定的HTML元素？

2 个答案: