Question

的Javascript。以下代码有效，但我必须调用该函数3次。

我应该使用replaceChild（）吗？

这是我到目前为止所做的：

<!DOCTYPE html>
<html>
<body>

<ul id="myList1"><li>1</li><li>2</li><li>3</li><li>4</li></ul>
<ul id="myList2"><li>a</li><li>b</li><li>c</li><li>d</li></ul>

<p id="demo">Click the button to move an item from one list to another</p>

<button onclick="myFunction()">Try it</button>

<script>
function myFunction()
{


var tmp = 5;

for(var i = 0; i < tmp; i++)
    {
        var node=document.getElementById("myList2").getElementsByTagName("LI")[i];
        document.getElementById("myList1").appendChild(node);

        var node2=document.getElementById("myList1").getElementsByTagName("LI")[i];
        document.getElementById("myList2").appendChild(node2);
    }

}

</script>

</body>
</html>

Answer 1

您无需替换任何内容，只需使用appendChild移动节点：

function myFunction() {

    var list1 = document.getElementById("myList1"),
        list2 = document.getElementById("myList2"),
        length1 = list1.children.length,
        length2 = list1.children.length;

    while (list1.children.length) {
        list2.appendChild(list1.children[0]);
    }

    while (list2.children.length > length2) {
         list1.appendChild(list2.children[0]);
    }
}

根据单一功能更改内容

1 个答案:

演示：http://jsfiddle.net/dfsq/4v94N/1/