IE:无效的目标元素 - 使用innerHTML + string附加表

时间:2013-03-01 00:36:49

标签: javascript ajax internet-explorer infinite-scroll

在Internet Explorer中,此行document.getElementById("left").getElementsByTagName("tbody")[0].innerHTML = document.getElementById("left").getElementsByTagName("tbody")[0].innerHTML + string;正在为我提供SCRIPT600: Invalid target element for this operation. …character 10

字符串只是包含一组表格的字符串。这适用于Chrome,Safari或Firefox。有没有更好的方法呢?我正在做的是,一旦用户到达页面底部,我将表格附加到表格中以加载更多内容。这是一种AJAX无限滚动类型的交易 - 客户要求。我正在使用Javascript,并且此时更愿意继续使用Javascript而不是仅为此任务更改为jQuery。

同样更新:document.getElementById("left").innerHTML = document.getElementById("left").innerHTML + string; 另外,左边是<table id="left">

2 个答案:

答案 0 :(得分:4)

是的,您需要先将它们包装起来:

var div = document.createElement("div");
div.innerHTML = "<table><tbody>" + string + "</tbody></table>";

document.getElementById("left")
  .appendChild(div.firstChild.tBodies[0]);

答案 1 :(得分:0)

当您需要在表的末尾插入表行时,略有不同。您的新代码,例如新的<tr>应该位于名为html的变量中。

if (document.attachEvent) { //if using old IE
    var currentTable = document.querySelector("#myTable");
    var currentTableHTML = currentTable.outerHTML;

    //replace closing tag with new code + closing tag
    currentTableHTML = currentTableHTML.replace("</tbody>", html + "</tbody>";

    currentTable.parentNode.removeChild(currentTable);

    //reinsert the table before some other element - you can use something else if you have a container for the table
    document.querySelector("#someElement").insertAdjacentHTML("beforebegin", currentTableHTML);
}
else {
    //use insertAdjacentHTML in a normal browser
}