Javascript Jquery接受格式错误的html和；“修复”；。我该怎么阻止这一切

女士们，先生们，我对jquery有意见

我在一个页面上有3个模板，一个用于表格顶部，一个用于底部，一个用于行。它们看起来像这样

标题

<div class="col-md-12 tableContainer">
    <table class="table table-hover table-condensed">
        <thead>
            <tr>
                <th class="hidden-xs"></th>
                <th></th>
                <th>Artist</th>
                <th></th>
                <th></th>
            </tr>
        </thead>
        <tbody>

问题是我可以停止jquery“修复”我的代码吗。如果是，怎么做

-----更新1-----

好的，下面是PJs的答案，我创建了以下内容

// First empty the target
target.empty();

// As Paul-Jan suggested we create one big string of html so it is well formed(or at least should be).
template = "";

// If we have a header we add it
if (header !== null) {
    template += header(dataSource[0]);
}

// Then we start the hackyness by adding a target placeholder for later. 
// I choose script as far as im aware this can go anywhere with out being incorrect html.
// And at this point I dont know if the header / footer are acting as a container ie nested or not.
template += "<script id='superMergerTarget'></script>";

// If we have footer add it.
if (footer !== null) {
    template += footer(dataSource[0]);
}

// Now we make the string a html object
htmlObject = $(template);

// So at this point we could have nothing but the script or a container or a wrapper
// So we iterate over like so.
for (var k = 0; k < htmlObject.length; k++)
{
    var targetReplaceo = $(htmlObject[k]).
        // check if its nested in container situation.
        find('#superMergerTarget').
        // Check self if wrapper or single situation.
        addBack('#superMergerTarget');

    if (targetReplaceo.length === 1) {
        var element = targetReplaceo[0];
        if (element.parentElement === null)
        {
            // If we are in here then either the header and or footer dont exists.
            // Or the header and footer are stand alone html not wrapping the content.
            // So we just go ahead and chuck it in the target.
            if (header !== null) {
                template = header(dataSource[0]);
                htmlObject = $(template);
                widget.bind(htmlObject, 0);
                target.append(htmlObject);
            }
            target[0].appendChild(fragment);
            if (footer !== null) {
                template = footer(dataSource[0]);
                htmlObject = $(template);
                widget.bind(htmlObject, 0);
                target.append(htmlObject);
            }

            break;
        }

        widget.bind(htmlObject, 0);

        // This part seems filthy and there is probably a much better way of doing it.
        // First we get an element to add the fragment too.
        var newElement = element.cloneNode();
        newElement.innerHTML = "";
        newElement.appendChild(fragment);
        // then we get the individual templates and add them one at a time.
        var childNodes = newElement.childNodes;

        for (var l = 0; l < childNodes.length; l++)
        {
            element.parentNode.insertBefore(childNodes[l], element);
        }

        // then remove the placeholder
        element.parentNode.removeChild(element);

        // then we add it to the target.
        target.append(htmlObject);

        break;
    }
}

//首先清空目标
target.empty（）；
//正如Paul Jan建议的那样，我们创建一个大的html字符串，使其格式良好（或者至少应该如此）。
模板=”；
//如果我们有一个标题，我们就添加它
如果（标题！==null）{
模板+=标题（数据源[0]）；
}
//然后，我们通过添加一个目标占位符开始hackynes，以供以后使用。
//我选择的脚本，因为我知道这可以去任何地方不被错误的html。
//在这一点上，我不知道页眉/页脚是否作为一个嵌套的容器。
模板+=“”；
//如果我们有页脚添加它。
如果（页脚！==null）{
模板+=页脚（数据源[0]）；
}
//现在我们将字符串设为html对象
htmlObject=$（模板）；
//因此，在这一点上，除了脚本、容器或包装器之外，我们什么都没有
//所以我们像这样迭代。
for（var k=0；k

---

我觉得这可能会更好，但确实有效，所以我很高兴，有人能提出更好的方法吗？

你不能。DocumentFragments是DOM节点，因此不能从“格式错误的HTML”构造它们。这几乎不是jQuery的错：）

---

然而，我还不明白为什么需要从格式错误的HTML构建文档片段。例如，是什么阻止您从页眉和页脚初始化片段（它们一起构成一个有效的DOM节点），然后从片段中获取tbody，并以批处理方式将行附加到它

如果您不希望jquery做html恶作剧，您需要以某种方式将html附加为未转义文本。这意味着您将不会使用任何

appendChild

或任何其他与DOM相关的函数来附加任何您想要的内容。不幸的是，我需要它是一个html对象，以便我可以调用fragment.appendChild查看这里的一些信息，我想知道是否有更好的方法添加片段。这并不能修复损坏的html。或者，最好的方法是将页脚和页眉连同中间的位置保持器元素一起注入其中。但我真的不想添加和额外的渲染事件。你不能使用片段来构建它，你需要先将它构建成一个字符串，然后再将它转换成任何与DOM相关的片段或元素。无论如何，字符串会比片段快，但真正的问题是没有办法在DOM中构建半棵树。如果使用的模板是正确格式的html，那么使用片段对我来说非常有效。也就是说，不像我提供的示例那样嵌套。我不知道可以将片段的子元素作为目标。这是一个好主意。我会试试看是否有效。我已经尝试使用你的建议创建一个解决方案，将页眉和页脚结合起来。这是否与你所谈论的内容一致：）？

        </tbody>
    </table>
</div>

// Bootstrap render call function 
// Results in correct markup as a string
template = bootstrapTemplateObject(dataSource[0]);

// At this point I need a htmlObject so I call it in jquery
// but then jquery decides it can fix it
htmlObject = $(template);
// Then I add the fragment
fragment.appendChild(htmlObject[0]);
// Then I bind the fragment
widget.bind(htmlObject, 0);

// First empty the target
target.empty();

// As Paul-Jan suggested we create one big string of html so it is well formed(or at least should be).
template = "";

// If we have a header we add it
if (header !== null) {
    template += header(dataSource[0]);
}

// Then we start the hackyness by adding a target placeholder for later. 
// I choose script as far as im aware this can go anywhere with out being incorrect html.
// And at this point I dont know if the header / footer are acting as a container ie nested or not.
template += "<script id='superMergerTarget'></script>";

// If we have footer add it.
if (footer !== null) {
    template += footer(dataSource[0]);
}

// Now we make the string a html object
htmlObject = $(template);

// So at this point we could have nothing but the script or a container or a wrapper
// So we iterate over like so.
for (var k = 0; k < htmlObject.length; k++)
{
    var targetReplaceo = $(htmlObject[k]).
        // check if its nested in container situation.
        find('#superMergerTarget').
        // Check self if wrapper or single situation.
        addBack('#superMergerTarget');

    if (targetReplaceo.length === 1) {
        var element = targetReplaceo[0];
        if (element.parentElement === null)
        {
            // If we are in here then either the header and or footer dont exists.
            // Or the header and footer are stand alone html not wrapping the content.
            // So we just go ahead and chuck it in the target.
            if (header !== null) {
                template = header(dataSource[0]);
                htmlObject = $(template);
                widget.bind(htmlObject, 0);
                target.append(htmlObject);
            }
            target[0].appendChild(fragment);
            if (footer !== null) {
                template = footer(dataSource[0]);
                htmlObject = $(template);
                widget.bind(htmlObject, 0);
                target.append(htmlObject);
            }

            break;
        }

        widget.bind(htmlObject, 0);

        // This part seems filthy and there is probably a much better way of doing it.
        // First we get an element to add the fragment too.
        var newElement = element.cloneNode();
        newElement.innerHTML = "";
        newElement.appendChild(fragment);
        // then we get the individual templates and add them one at a time.
        var childNodes = newElement.childNodes;

        for (var l = 0; l < childNodes.length; l++)
        {
            element.parentNode.insertBefore(childNodes[l], element);
        }

        // then remove the placeholder
        element.parentNode.removeChild(element);

        // then we add it to the target.
        target.append(htmlObject);

        break;
    }
}