javascript - 设置html时验证

Question

我有一些代码可以从服务器端获取电子邮件，将它们显示在表格中，当选择其中之一时，我会在表格下方显示该电子邮件的正文。问题是某些电子邮件包含错误的 html(例如，开始标签没有匹配的结束标签)，这会在我的网站中造成一些令人讨厌的副作用。 (例如，无法使用ajax调用来调用服务器端)。

 createTable: function () {
        Loader.show();
        var html = '<span id="correspondenceTt">Correspondence History</span><table id="correspondence"><tr class="th"><th class="from">From</th><th class="to">To</th><th>Subject</th><th class="date">Date</th><th class="attachments">Attachments</th></tr>';

        for (var i = 0; i < mailViewer.mails.length; i++) {
            var mail = mailViewer.mails[i];

            html += '<tr id="' + i + '" class="odd">';
            html += mailViewer.reduceEmailList(this.fixMailAddress(mail.From), 30);
            html += mailViewer.reduceEmailList(this.fixMailAddress(mail.To), 30);
            html += mailViewer.reduceSection(mail.Subject, 45);
            html += mailViewer.reduceSection(d.toLocaleString(), 21);
            html += '<td class="att" id="' + mail.Id + '">';           
            html += '<div class="eml" id="' + i + 'html">' + '   ' + mail.Body + '</div></td></tr>';
        }
        html += '</table><div id="dipEmail" style="margin-top:' + Math.min(mailViewer.mails.length * 28 + 23, 248) + 'px;"><div id="mailContainer"></div></div>';
        mailViewer.setHtml(html);

现在我的问题是，如何清理电子邮件的 html，或者如何将其设置在元素内，这样就不会影响我网站的包装 html？

Answer 1

您可以将内容注入(inject)到容器中，然后调用 normalize() 方法。这将返回一个有效的内容，可以将其删除以合并到您的模板中。这是一个例子:

// Container element
var element = document.createElement('DIV');
var html = '<table><tr><td>ola</tr>';
element.innerHTML = html;
// Normalize
element.normalize();

console.log(element.innerHTML);
// return: <table><tbody><tr><td>ola</td></tr></tbody></table>