我有一个表示元素的HTML字符串：“<li>text</li>”。我想将它附加到DOM中的一个元素（在我的例子中是一个ul）。如何使用Prototype或DOM方法做到这一点？
（我知道我可以在jQuery中轻松做到这一点，但不幸的是，我们没有使用jQuery。）
当前回答
这也会奏效：
$('<li>').text('hello').appendTo('#mylist');
它感觉更像是一种带有链式函数调用的jquery方式。
其他回答
使用insertAdjacentHTML（）。它适用于所有当前浏览器，即使是IE11。
var mylist=文档.getElementById（'mylist'）；mylist.insertAdjacentHTML（'beforeend'，'<li>third</li>'）；<ul id=“mylist”><li>第一个</li><li>第二个</li></ul>
这里有一个简单的方法：
String.prototype.toDOM=function(){
var d=document
,i
,a=d.createElement("div")
,b=d.createDocumentFragment();
a.innerHTML=this;
while(i=a.firstChild)b.appendChild(i);
return b;
};
var foo="<img src='//placekitten.com/100/100'>foo<i>bar</i>".toDOM();
document.body.appendChild(foo);
从字符串渲染DOM的最快解决方案：
let render = (relEl, tpl, parse = true) => {
if (!relEl) return;
const range = document.createRange();
range.selectNode(relEl);
const child = range.createContextualFragment(tpl);
return parse ? relEl.appendChild(child) : {relEl, el};
};
在这里，您可以检查DOM操作React与原生JS的性能
现在您可以简单地使用：
let element = render(document.body, `
<div style="font-size:120%;line-height:140%">
<p class="bold">New DOM</p>
</div>
`);
当然，在不久的将来，您将使用来自内存的引用，因为var“element”是您在文档中新创建的DOM。
记住“innerHTML=”非常慢：/
我添加了一个Document原型，它从字符串创建一个元素：
Document.prototype.createElementFromString = function (str) {
const element = new DOMParser().parseFromString(str, 'text/html');
const child = element.documentElement.querySelector('body').firstChild;
return child;
};
用法：
document.createElementFromString("<h1>Hello World!</h1>");
答复
创建模板将模板的innerHTML设置为strim.trim（）创建模板的子级数组返回子项、子项或
函数toElement（s=“”，c，t=document.createElement（'template'），l='length'）{t.innerHTML=s.trim（）；c=[…t.content.childNodes]；返回c[l]>1？c： c[0]| |“”；｝console.log（toElement（））；console.log（toElement（“”））；console.log（toElement（“”））；console.log（toElement（'<td>With td</td>'））；console.log（toElement（'<tr><td>With t</td></tr>'））；console.log（toElement（'<tr><td>foo</td></tr><tr><td>bar</td></tr>'））；console.log（toElement（'<div><span><span>嵌套</span><span>填充</span></div>'））；
