是否可以在不破坏后代事件侦听器的情况下追加到innerHTML？
是否可以在不破坏后代事件侦听器的情况下追加到innerHTML？
onclickalert().
innerHTMLonclick
<html>
<head>
<script type="text/javascript">
function start () {
myspan = document.getElementById("myspan");
myspan.onclick = function() { alert ("hi"); };
mydiv = document.getElementById("mydiv");
mydiv.innerHTML += "bar";
}
</script>
</head>
<body onload="start()">
<div id="mydiv" style="border: solid red 2px">
<span id="myspan">foo</span>
</div>
</body></html>
拉风的咖菲猫浏览 360回答 3
3回答
-
HUX布斯
不幸的是，分配给innerHTML导致所有子元素的破坏，即使您试图追加。如果希望保留子节点(及其事件处理程序)，则需要使用DOM函数:function start() { var myspan = document.getElementById("myspan"); myspan.onclick = function() { alert ("hi"); }; var mydiv = document.getElementById("mydiv"); mydiv.appendChild(document.createTextNode("bar"));}编辑：鲍勃的解决方案，从评论。发你的答案鲍勃！为它获得荣誉。*-)function start() { var myspan = document.getElementById("myspan"); myspan.onclick = function() { alert ("hi"); }; var mydiv = document.getElementById("mydiv"); var newcontent = document.createElement('div'); newcontent.innerHTML = "bar"; while (newcontent.firstChild) { mydiv.appendChild(newcontent.firstChild); }} -
三国纷争
现在是2012年了，jQuery的附加函数和前置函数正是这样做的，在不影响当前内容的情况下添加内容。非常有用。
随时随地看视频慕课网APP
JavaScript
Html/CSS