gpt4 book ai didi

JavaScript:cloneNode 和 appendChild 未按预期工作

转载 作者:行者123 更新时间:2023-11-30 08:12:00 25 4
gpt4 key购买 nike

我有一段这样的代码——

<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"的表只附加一次,而不像按下 CLONE 按钮那样多次?

最佳答案

因为只有一个克隆。

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>

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

关于JavaScript:cloneNode 和 appendChild 未按预期工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8916181/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com