将HTML字符串附加到DOM

Question

如何附加这个HTML字符串

var str = '<p>Just some <span>text</span> here</p>';

到具有'test'DOM中ID的DIV ？

（顺便说一句div.innerHTML += str;是不可接受的。）

Answer 1

这可以接受吗？var child = document.createElement('div');child.innerHTML = str;child = child.firstChild;document.getElementById('test').appendChild(child);jsFiddle。但是，尼尔的答案是一个更好的解决方案。

Answer 2

这个想法是innerHTML在中间元素上使用，然后将其所有子节点移动到您真正想要的子节点appendChild。var target = document.getElementById('test');var str = '<p>Just some <span>text</span> here</p>';var temp = document.createElement('div');temp.innerHTML = str;while (temp.firstChild) {&nbsp; target.appendChild(temp.firstChild);}这样可以避免清除所有事件处理程序，div#test但仍允许您附加HTML字符串。