0

それで、DOMを使用してデータを取得するプロジェクトを完成させました。すべてがうまく機能し、私のコードはコード レビューに合格しました。しかし、新しい機能を実装したある日、コードが壊れてしまいました。私は触れていない壊れたコードを取り、ここにある W3C 学校のテスト場所で複製しました。

http://www.w3schools.com/dom/tryit.asp?filename=try_dom_nodelist_item

そこにマイ コードをコピーして実行するだけです。テーブルには明らかに 5 つの行があるため、"5" が表示されると予想される場合、出力は "2" として取得されます。この質問に答えてくれる教祖がいることを願っています。前もって感謝します。

役立つ可能性があるその他の情報: これを Visual Studio でも実行し、デバッグして、何が起こっているかを確認しました。どうやら、何行入れても常に2つ吐き出され、さらに吐き出される2つのオブジェクトは両方ともnullです。これはどのように奇妙ですか??

<!DOCTYPE html>
<html>
<head>
</script>
</head>
<body>
            <h2><i>Albums</i></h2> 
            <table cellspacing="0" border="4" id = "table" class = "lazyProgressiveLoad">
                <tr style="font-style: italic; font-size: small; font-family: Segoe UI Light; color: Navy">
                    <th>--Id--</th>
                    <th>--Name--</th>
                    <th>--Description--</th>
                    <th><input type="button" value="Add Album" onclick="alert('Guru's Please Help!!!')" id = "addAlbum"/></th>
                </tr>
                <tr>
                    <td>Load, Search, or Add Albums to Get Started!</td>
                    <td>~~~</td>
                    <td>~~~</td>
                    <td>~~~</td>
                </tr>
                <tr>
                    <td>Load, Search, or Add Albums to Get Started!</td>
                    <td>~~~</td>
                    <td>~~~</td>
                    <td>~~~</td>
                </tr>
                <tr>
                    <td>Load, Search, or Add Albums to Get Started!</td>
                    <td>~~~</td>
                    <td>~~~</td>
                    <td>~~~</td>
                </tr>
                <tr>
                    <td>Load, Search, or Add Albums to Get Started!</td>
                    <td>~~~</td>
                    <td>~~~</td>
                    <td>~~~</td>
                </tr>
                <tr>
                </tr>
            </table>
<script>
window.onload = function () {
alert(parseInt(document.getElementById("table").childNodes.length));
}

</script>
</body>
</html>
4

3 に答える 3

5

いいえ、DOM のバグではありません。HTMLtableに がないtbodyため、ブラウザによって自動的に挿入されます。tbody2 つのノードは、と テキスト ノードである可能性があります。

確認する簡単な方法は、childNodes.

console.log(document.getElementById("table").childNodes);

または、それらを個別に記録します。

var table = document.getElementById("table");
console.log(table.childNodes[0], table.childNodes[1]);

プロパティを介してすべてのテーブル行に直接アクセスでき.rowsます。

document.getElementById("table").rows

またはtBodiesコレクションを通じて。

document.getElementById("table").tBodies[0].rows
于 2012-09-25T17:03:53.997 に答える
1

childNodes試してみる代わりにrows

alert(parseInt(document.getElementById("table").rows.length));

正しい行を取得する必要があります。また、 を返すparseIntため、使用する必要はありません。.lengthinteger

于 2012-09-25T17:05:14.520 に答える