文章/答案/技术大牛

发布

社区首页 >问答首页 >JavaScript: cloneNode和appendChild未按预期工作

问JavaScript: cloneNode和appendChild未按预期工作
EN

Stack Overflow用户

提问于 2012-01-19 03:33:39

回答 2查看 4.2K关注 0票数 1

我有一段这样的代码-

<script>
    var x,m,cloneNodex;
    function addVtier() {
            m.appendChild(cloneNodex);
    }
    function load() {
        x = document.getElementById("vtier#1");
             cloneNodex = x.cloneNode(true);
        m = document.getElementById("main");    
    }
</script>
<body onload = load();>
<div  id = "main">
<table id = "vtier#1" width="100%" class="heading">
        <tr>
            <td>
                <button onclick=addVtier();>clone</button> 
            </td>
            <td> 1.Vtier Name:
                <select>
                    <option>Volvo</option>
                    <option>Saab</option>
                    <option>Mercedes</option>
                    <option>Audi</option>
                </select>
            </td>   
        </tr>
</table>
</div>
</body>

现在我的问题是，为什么这只会附加克隆节点，即带有id="vtier#1“的表一次，而不是按下克隆按钮那么多次？

javascript

回答 2

Stack Overflow用户

回答已采纳

发布于 2012-01-19 03:38:00

因为只有一个克隆人。

var y = node;
x.appendChild(y);
x.appendChild(y);

只追加y一次，因为只有一个y。

<body>
<div  id = "main">
<table id = "vtier#1" width="100%" class="heading">
        <tr>
            <td>
                <button>clone</button> 
            </td>
            <td> 1.Vtier Name:
                <select>
                    <option>Volvo</option>
                    <option>Saab</option>
                    <option>Mercedes</option>
                    <option>Audi</option>
                </select>
            </td>   
        </tr>
</table>
</div>
<script>
    (function () {
        var main = document.getElementById("main"),
            vtier = document.getElementById("vtier#1").cloneNode(true);

        document.getElementsByTagName("button")[0].addEventListener("click", addClone);

        function addClone() {
            main.appendChild(vtier.cloneNode(true));
        }
    }());
</script>
</body>

还通过删除全局变量和使用不显眼的事件侦听器为您修复了代码。

票数 4

Stack Overflow用户

发布于 2012-01-19 03:37:41

附加一个属于DOM的节点首先会将其从当前位置移除，因此您不会通过两次添加相同的节点来获得两个克隆。

这似乎就是你正在做的事情，你只调用一次cloneNode，而不是每次点击克隆按钮。

将cloneNodex =从load移到addVtier中，您应该会得到多个副本。

票数 2

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/8916181

复制

相似问题

问JavaScript: cloneNode和appendChild未按预期工作
EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问JavaScript: cloneNode和appendChild未按预期工作EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问JavaScript: cloneNode和appendChild未按预期工作
EN