时间戳

首页 > 解决方案 > 将行内容附加到 html 表中的另一行

html - 将行内容附加到 html 表中的另一行

问题描述

在 HTML 文档中，我试图将两行内容合并到 HTML 表中的一行中。合并行后，必须用这个新行更新 dom，并且要删除前两个。例如：假设表格如下所示

<!DOCTYPE html>
<html>
<body>
<h2>Basic HTML Table</h2>
<table style="width:100%">
  <tr>
    <td>Jill</td>
    <td>Smith</td>
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td>
  </tr>
  </tr>
</table>
</body>
</html>

预期结果应该在文档中有一行。

<tr>
  <td>Jill</td>
  <td>Smith</td>
  <td>Eve</td>
  <td>Jackson</td>
</tr>

标签： htmldomhtml-table

解决方案

这是提供解决方案

  function copyDiv(){
  var firstRow= document.querySelector("tr:nth-child(1)");
  var secondRow = document.querySelector("tr:nth-child(2)");
  firstRow.innerHTML += secondRow.innerHTML;
  document.querySelector("table").deleteRow("1");
     }

推荐阅读