用文档片段javascript替换元素内容

我试图用文档片段替换元素的所有内容：

var frag = document.createDocumentFragment()

正在创建文档片段.没有问题.我添加元素就好了,也没有问题.我可以使用element.appendChild(frag)附加它.那工作也很好.

我正在尝试创建一个类似于jQuery的HTML的“替换”方法.我不担心旧浏览器的兼容性.是否有一个神奇的功能来替换元素的所有内容？

我已经尝试过element.innerHTML = frag.cloneNode(true),(根据我可以找到的每个“替换元素内容”wiki),这不起作用.它给了我< div> [object DocumentFragment]< / div&gt ;. 没有图书馆.
这意味着如果你把一个jQuery解决方案作为一个答案,你会得到downVoted.不想成为一个混蛋,但每次都会发生.

谢谢！

编辑
为了清楚起见,我正在寻找一个“魔术”解决方案,我知道如何一次删除所有现有的元素,然后附加我的片段.

解决方法

你试过replaceChild

这样的东西

element.parentNode.replaceChild(frag,element)

来源：https://developer.mozilla.org/en-US/docs/DOM/Node.replaceChild

原来的jsfiddle：http://jsfiddle.net/tomprogramming/RxFZA/

编辑：啊,我没看到替换内容.好吧,先删除它们！

element.innerHTML = "";
element.appendChild(frag);

jsfiddle：http://jsfiddle.net/tomprogramming/RxFZA/1/

请注意,在jsfiddle中,我只使用jquery来连接按钮,整个点击处理程序都是原始的javascript.

Edit2：pimvdb也提示,只是将新的东西添加到一个分离的元素并替换.

var newElement = element.cloneNode();
newElement.innerHTML = "";
newElement.appendChild(frag);
element.parentNode.replaceChild(newElement,element);

http://jsfiddle.net/tomprogramming/RxFZA/3/

原文地址：https://www.jb51.cc/js/152873.html