重复包含已定义id属性的元素的HTML代码段

我需要在一个页面上多次重复一个html片段，但问题是所包含的html元素定义了id，该id在页面上应该是唯一的。那么，在不从元素中删除id属性的情况下，我重复这个代码段的正确方法是什么呢

---

我可以使用iframe作为这个代码段的容器吗？让重复的ID存在于第页上？

您可以使用JavaScript克隆代码段，同时更改ID

如果您的代码段是：

<div id="snippet">
   <table id="list">
    <tr id="0">
      <td id="firstName0">John</td>
      <td id="lastName0">Smith</td>
   </tr>
   <tr id="1">
      <td id="firstName2">John</td>
      <td id="lastName2">Doe</td>
   </tr>
  </table>
</div>

将产生

<div id="snippet_1">
   <table id="list_1">
    <tr id="0_1">
      <td id="firstName0_1">John</td>
      <td id="lastName0_1">Smith</td>
   </tr>
   <tr id="1_1">
      <td id="firstName2_1">John</td>
      <td id="lastName2_1">Doe</td>
   </tr>
  </table>
</div>

---

这将解决重复ID的问题。

但是在html之间也有javascript，比如onclick或onkeyup，它引用使用ID的元素。以这种方式更改ID对我来说可能不是一个解决方案。。

<div id="snippet_1">
   <table id="list_1">
    <tr id="0_1">
      <td id="firstName0_1">John</td>
      <td id="lastName0_1">Smith</td>
   </tr>
   <tr id="1_1">
      <td id="firstName2_1">John</td>
      <td id="lastName2_1">Doe</td>
   </tr>
  </table>
</div>