如何使用javascript将隐藏div标记的内容推送到表行？

我有一个带有AddMore按钮的表，它添加了一定数量的行，其中包含输入。但是这些行的HTML字符串已经变得足够大了，这将成为一种痛苦。 因此，我的想法是使用一个带有所需HTML的div隐藏标记，在单击AddMore按钮时，该标记会重复一次又一次。 因此，如何将div标记innerHTML推送到TR中。下面是我需要推送到的代码，所以我将它保存在隐藏的div标记中

<tr>
            <td><label for="bucket_size"><b>1.</b> Bucket Size:</label></td>
            <td><input type="text" name="bucket_size[]" id="bucket_size"></td>
            <td><label for="control_bucket_size">Control Bucket Size: </label></td>
            <td><input type="text" name="control_bucket_size[]" id="control_bucket_size" value="0"></td>
        </tr>
        <tr>
            <td><label for="from_date">Active From: </label></td>
            <td><input type="text" name="from_date[]" id="from_date" class="hasDatePicker"></td>
            <td><label for="to_date">To: </label></td>
            <td><input type="text" name="to_date[]" id="to_date" class="hasDatePicker"></td> 
        </tr>
        <tr>
            <td><label for="location">Location: </label></td>
            <td class="locationSelect">                   
            </td>
            <td style="text-align:center;" colspan="2"></td>
        </tr>

1.铲斗尺寸：
控制铲斗大小：
从以下位置激活：
致：
地点：

---

如果直接在特定的TR之后插入，即div标记的innerHTML，则无法正确插入。如何操作？

如果要克隆一个表行，请使用另一个表行，而不是div。如果不使用innerHTML，请使用

...
var original_node=document.getElementById（'clone_me'）；
var clone_node=原始_node.cloneNode（true）；
克隆节点。删除属性（'id'）；//防止重复ID
试一试{
clone_node.style.display='表行'；
}
捕获（iesucks）{
clone_node.style.display='block'；//应该是'table row'，但需要对IE 6-7进行此攻击
}
原始节点.父节点.附加子节点（克隆节点）；//将新节点添加到表的末尾

---

如果您发现较旧的IE在

显示：表行

方面遇到困难，请尝试切换

可见性

。

您不能将TR作为DIV的子项，即使该DIV是隐藏的（它是无效的标记）。您不能通过在IE<9中更改表格的innerHTML来修改表格（尽管您可以编写整个表格或更改单元格的内容）。使用DOM方法

最好的方法可能是克隆一行，然后更新name和id属性，以及其他需要它的内容，并将其附加到TBODY。如果附加到表中，大多数浏览器都可以，但是IE会呕吐，所以附加到TBODY

非常简单的例子：

<table>
  <tr onclick="this.parentNode.appendChild(this.cloneNode(true))">
    <td>Here is a cell in a row
    <td>Here is a cell in a row
</table>

这是一排单元格
这是一排单元格

Actually div.innerHTML返回上述代码，不带TR和TD标记。因此，表被扭曲了。您忘记了

clone\u node.style.display=''并应更改ID，因为您现在有两行ID为clone_me.：-）有没有其他方法来替换表结构？像UL/LI这样处理这个案子吗？@Rodge:抓得好，回答更新了。但我不确定是否要将display设置为空字符串，这是否合法？@akki:它适用于任何类型的DOM元素，尽管您希望将display值更改为更合适的值。@rodge:Ahh我明白了。。利用一个bug解决另一个bug（）。将“显示”设置为空字符串将恢复为默认值。
<table>
  <tr onclick="this.parentNode.appendChild(this.cloneNode(true))">
    <td>Here is a cell in a row
    <td>Here is a cell in a row
</table>