我有一个表示元素的HTML字符串：“<li>text</li>”。我想将它附加到DOM中的一个元素（在我的例子中是一个ul）。如何使用Prototype或DOM方法做到这一点？
（我知道我可以在jQuery中轻松做到这一点，但不幸的是，我们没有使用jQuery。）
当前回答
您可以使用以下函数将文本“HTML”转换为元素
函数htmlToElement（html）{var element=document.createElement（'div'）；element.innerHTML=html；返回（元素）；}var html=“<li>text和html</li>”；var e=htmlToElement（html）；
其他回答
var msg=“测试”jQuery.parseHTML（消息）
可以使用以下方法从字符串创建有效的DOM节点：
document.createRange（）.createContextualFragment（）
以下示例在页面中添加一个按钮元素，从字符串中获取标记：
让html='<button type=“button”>单击我</按钮>'；let fragmentFromString=函数（strHTML）{return document.createRange（）.createContextualFragment（strHTML）；}let fragment=fragmentFromString（html）；document.body.appendChild（片段）；
从字符串渲染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=”非常慢：/
解决方案-适用于自IE 4.0以来的所有浏览器
var htmlString = `<body><header class="text-1">Hello World</header><div id="table"><!--TABLE HERE--></div></body>`;
var tableString = `<table class="table"><thead><tr><th>th cell</th></tr></thead><tbody><tr><td>td cell</td></tr></tbody></table>`;
var doc = document.implementation.createHTMLDocument();
doc.open();
doc.write(htmlString);
doc.getElementById('table').insertAdjacentHTML('beforeend', tableString);
doc.close();
console.log(doc);
或者你可以使用DOMParser
var doc = (new DOMParser).parseFromString(htmlString, "text/html");
doc.getElementById('table').insertAdjacentHTML('beforeend', tableString);
console.log(doc);
您可以使用以下函数将文本“HTML”转换为元素
函数htmlToElement（html）{var element=document.createElement（'div'）；element.innerHTML=html；返回（元素）；}var html=“<li>text和html</li>”；var e=htmlToElement（html）；
