如何能不借助容器 将 “node节点字符串” 插入到页面

Question

现有变量 str

var str = '<img src="xxx.jpg"/>'

我希望把str直接插入到body中

• 但我目前只掌握一种方法

  var domContainer =  document.createElement('div');
  domContainer.innerHTML = str;document.body.appendChild(domContainer)

• 这样做生成的img标签外面会有一层div 虽然不影响需求实现 但 我想知道 能否直接就node字符串的结构 直接插入到页面中而不借助容器

Answer 1

document.body.innerHTML += str

Answer 2

反对楼上的答案，直接修改 document.body 怕不是楼主想要的答案；+= 操作需要重新渲染所有节点，性能不好。你可以生成 DOM 节点后，再把它们从容器里挪出来，比如这样：const container = document.createElement('div'); container.innerHTML = str;while (container.childNodes.length) {  document.body.appendChild(container.childNodes[0]); }不过这样会多次更新 DOM，也要看具体的需求。（为了编辑这个答案被联盟搞杀了……）