2013-03-01 10 views
5

を使用してテーブルを追加するInternet Explorerで、この行document.getElementById("left").getElementsByTagName("tbody")[0].innerHTML = document.getElementById("left").getElementsByTagName("tbody")[0].innerHTML + string;は、文字列は、単にtablerowsのセットが含まれているものである私にSCRIPT600: Invalid target element for this operation. …character 10IE:無効なターゲット要素 - のinnerHTML +文字列

を与えています。これは、Chrome、Safari、Firefoxで正常に動作します。これを行うより良い方法はありますか?私がやっていることは、ユーザーがページの一番下に来ると、テーブルにタブローを追加して、より多くのコンテンツを読み込むことです。これは、AJAXの無限スクロール型の取引の一種です。クライアントが要求したものです。私はJavascriptを使用していますが、この時点でJavascriptにとどまり、jQueryに変更するのではなく、このタスクのために変更しません。また

アップデートと同じで:document.getElementById("left").innerHTML = document.getElementById("left").innerHTML + string; また、左はい、あなたが最初にこのようにそれらをラップする必要があります<table id="left">

+5

IEのテーブル、テーブルセクション、またはテーブルの行要素のinnerHTMLを設定することはできません。 innerHTMLを使用すると、テーブル全体、またはセルの内容だけを書き込むことができます。 DOMメソッドを使用します。 PS。 Ajaxの「無限スクロール」ページは、ユーザビリティの問題が深刻であるため、嫌いです。 – RobG

+0

@RobGあなたが提案しているもの(最初の2つの文は矛盾しているようです)は、私が試したことです:innerHTMLでテーブル全体を書き直すことです。第二に、私はDOMメソッドを使用していると信じています。文字列ではなくDOMを介して追加の行を作成する必要があると言っていますか?最後に無限のスクロールがクライアントから要求されます。 – michaellindahl

+0

@RobGよくDOMにコードを書き出そうとしましたが、 'newLink.onclick = function(){toggleVote()};'私の話を聞きたくありませんでした。 @KernelJamesには素晴らしいソリューションがあります。同意しますか? – michaellindahl

答えて

4

です:あなたは、テーブルを挿入する必要があるときのため

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

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

+1ですが、tbody **タグ**はオプションですので、必要ではありません(入力するのが少なくて済みます)。tbody **要素**は必須ですので、デフォルトで生成されます。 – RobG

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 
} 
関連する問題