javascript - IE innerHTML 错误

Question

这与已经针对该主题提出的问题略有不同。我使用该建议来转换这样的函数:

function foo() {

    document.getElementById('doc1').innerHTML = '<td>new data</td>';

}

进入这个:

function foo() {

    newdiv = document.createElement('div');
    newdiv.innerHTML = '<td>new data</td>';

    current_doc = document.getElementById('doc1');
    current_doc.appendChild(newdiv);

}

但这仍然行不通。在这两种情况下，包含 innerHTML 的行都会出现“未知运行时错误”。

我认为创建 newdiv 元素并在其上使用 innerHTML 可以解决问题？

Answer 1

无法在 Internet Explorer 中单独创建 td 或 tr。同样的问题在其他浏览器中也存在了很长一段时间，但是这些浏览器的最新版本不再受该问题的困扰。

您有 2 个选择:

1. 使用特定于表的 API 添加细胞/行。参见示例 MSDNfor insertCell等等
2. 创建一个效用函数，即将帮助您创建 DOM 节点弦外。如果是表格，您需要包装 HTML，以便生成的 HTML 始终是表格，然后通过标签名称获取所需的元素。

例如像这样:

var oHTMLFactory = document.createElement("span");
function createDOMElementFromHTML(sHtml) {
    switch (sHtml.match(/^<(\w+)/)) {
        case "td":
        case "th":
            sHtml   = '<tr>' + sHtml + '</tr>';
            // no break intentionally left here
        case "tr":
            sHtml   = '<tbody>' + sHtml + '</tbody>';
            // no break intentionally left here
        case "tbody":
        case "tfoot":
        case "thead":
            sHtml   = '<table>' + sHtml + '</table>';
            break;
        case "option":
            sHtml   = '<select>' + sHtml + '</select>';
    }
    oHTMLFactory.innerHTML = sHtml;

    return oAML_oHTMLFactory.getElementsByTagName(cRegExp.$1)[0] || null;
}

希望这对您有所帮助!