将任意 HTML 插入 DocumentFragment

我知道adding innerHTML记录片段 http://lists.w3.org/Archives/Public/public-webapps/2011OctDec/0663最近已经讨论过，并且有望包含在 DOM 标准中。但是，您同时应该使用什么解决方法？

也就是说，取

var html = '<div>x</div><span>y</span>';
var frag = document.createDocumentFragment();

我想要两个div和span代替frag，用一句简单的话来说。

无循环的奖励积分。允许使用 jQuery，但我已经尝试过$(html).appendTo(frag); frag之后仍然是空的。

这是一个方法现代浏览器 http://caniuse.com/template不循环：

var temp = document.createElement('template');
temp.innerHTML = '<div>x</div><span>y</span>';

var frag = temp.content;

或者，作为可重复使用的

function fragmentFromString(strHTML) {
    var temp = document.createElement('template');
    temp.innerHTML = strHTML;
    return temp.content;
}

更新： 我找到了一种更简单的方法来使用 Pete 的主要思想，它将 IE11 添加到其中：

function fragmentFromString(strHTML) {
    return document.createRange().createContextualFragment(strHTML);
}

覆盖范围比之前的好<template>方法并在 IE11、Ch、FF 中测试正常。

提供现场测试/演示http://pagedemos.com/str2fragment/ http://pagedemos.com/str2fragment/