如何将文档片段作为HTML字符串返回

Question

我正在创建一个HTML元素数组。

var elements = [];

大多数这些元素都作为简单的HTML字符串添加到数组中，如下所示：

function myHtml() {
    return '<div>Hi there, here\'s some HTML</div>';
}

elements.push(myHtml());

但是，其中一个元素是作为文档片段生成的，如下所示：

function myFragment() {
    var fragment = document.createDocumentFragment();
    var div = document.createElement('div');
    div.appendChild(document.createTextNode('Hi there, here\'s some HTML');
    fragment.appendChild(div);
    return fragment;
}

elements.push(myFragment());

创建数组后，我将所有元素插入到DOM中，如下所示：

function myHtml() {...}
function myFragment() {...}

var elements = [];

elements.push(myHtml(), myFragment());

$('.my-selector').html(elements);

当然，问题是文档片段不能像那样工作，所以它不会像我需要的那样插入到DOM中。我不能以正常的方式将片段附加到.my-selector的原因是因为我根据不同的条件生成不同的数组，例如：

if (condition1) {
    elements.push(myHtml1(), myHtml2(), myFragment());
else {
    elements.push(myHtml3(), myFragment(), myHtml4());
}

$('.my-selector').html(elements);

元素出现的顺序很重要。

我发现了很多用于将HTML字符串转换为文档片段的解决方案，但无法将文档片段转换为HTML字符串，以便我可以以这种方式使用它。可能吗？有什么东西真的很简单吗？

Answer 1

将其附加到元素并获取元素的innerHTML

let div=document.createElement("div");
div.appendChild(fragment);
div.innerHTML;