用文档片段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

原来的jsfiddlehttp://jsfiddle.net/tomprogramming/RxFZA/

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

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

jsfiddlehttp://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/

相关文章

前言 做过web项目开发的人对layer弹层组件肯定不陌生,作为l...
前言 前端表单校验是过滤无效数据、假数据、有毒数据的第一步...
前言 图片上传是web项目常见的需求,我基于之前的博客的代码...
前言 导出Excel文件这个功能,通常都是在后端实现返回前端一...
前言 众所周知,js是单线程的,从上往下,从左往右依次执行,...
前言 项目开发中,我们可能会碰到这样的需求:select标签,禁...