javascript - 多次克隆一个元素

Question

我有一个 li 元素 是 div 的父元素，id holder。我需要多次克隆 li，让所有克隆成为 holder div 的父级并更改它们的 data-ids。我的层次结构如下所示:

<div id="holder">
    <li data-id=0 class="element">
        //other nodes
    </li>
</div>

我如何克隆 li 元素 并更改它的 data-id 所以我得到:

<div id="holder">
    <li data-id=0 class="element">
        //other nodes
    </li>
    <li data-id=1 class="element">
        //other nodes
    </li>
    <li data-id=2 class="element">
        //other nodes
    </li>
    <li data-id=3 class="element">
        //other nodes
    </li>
    <li data-id=4 class="element">
        //other nodes
    </li>
    <li data-id=5 class="element">
        //other nodes
    </li>
</div>

-- 大卫

Answer 1

只需使用 clone和 attr :

var holder, li, clone, counter;
holder = $("#holder");
li = holder.find("li:first");
counter;
for (counter = 1; counter <= 5; ++counter) {
    clone = li.clone();
    clone.attr("data-id", counter);
    clone.appendTo(holder);
}