我有一个表示元素的HTML字符串：“<li>text</li>”。我想将它附加到DOM中的一个元素（在我的例子中是一个ul）。如何使用Prototype或DOM方法做到这一点？
（我知道我可以在jQuery中轻松做到这一点，但不幸的是，我们没有使用jQuery。）
当前回答
对于某些html片段，如<td>test</td>、div.innerHTML、DOMParser.parseFromString和range.createContextualFragment（没有正确的上下文），此处其他答案中提到的解决方案不会创建<td>元素。
jQuery.parseHTML（）正确处理它们（我将jQuery2的parseHTML函数提取为一个独立函数，可以在非jQuery代码库中使用）。
如果您只支持Edge 13+，那么只使用HTML5模板标记会更简单：
function parseHTML(html) {
var t = document.createElement('template');
t.innerHTML = html;
return t.content;
}
var documentFragment = parseHTML('<td>Test</td>');
其他回答
这也会奏效：
$('<li>').text('hello').appendTo('#mylist');
它感觉更像是一种带有链式函数调用的jquery方式。
这里有一个简单的方法：
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);
答复
创建模板将模板的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>'））；
较新的DOM实现具有range.createContextualFragment，它以独立于框架的方式完成您所需的操作。
它得到了广泛的支持。不过，为了确保这一点，请在同一MDN链接中检查其兼容性，因为它会发生变化。截至2017年5月：
Feature Chrome Edge Firefox(Gecko) Internet Explorer Opera Safari
Basic support (Yes) (Yes) (Yes) 11 15.0 9.1.2
var jtag = $j.li({ child:'text' }); // Represents: <li>text</li>
var htmlContent = $('mylist').html();
$('mylist').html(htmlContent + jtag.html());
使用jnerator
