2

次のスクリプトでは、 DOMツリーを移動しようとしましたが、期待する出力が得られません。

これにはHTMLのほんの一部しかありません：

<p id="para">This is inside the <em>p</em> tag.</p>

私が木を移動するとき、これは私が得るものです：

Node Name : P
Node Type : 1
Node Value : null


Node Name : HTML
Node Type : 1
Node Value : null

<html>
<head>
    <title>JavaScript</title>
</head>

<body> 
    <p id="para">This is inside the <em>p</em> tag.</p>

    <script type="text/javascript">
        function nodeStatus(node) {
            document.write("Node Name : " + node.nodeName + "<br />");
            document.write("Node Type : " + node.nodeType + "<br / >");
            document.write("Node Value : " + node.nodeValue + "<br / >");
            document.write("<br / > <br / >");
        }
        var curElement = document.getElementById("para");
        nodeStatus(curElement); // p tag
        curElement = document.firstChild; // This is inside the 
        nodeStatus(curElement);
        curElement = document.nextSibling; // em tag
        nodeStatus(curElement);
        curElement = document.firstChild; // p
        nodeStatus(curElement); 
    </script>
</body>

から値を取得しないのはなぜtext-nodeですか？

そして、ノード名として取得するHTMLは何ですか？ノードにHTMLという名前を付けていません。

jsFiddle： http: //jsfiddle.net/HmkJQ/

4

2 に答える 2

5

あなたがしていることは、コードの各行のトップレベルのドキュメントからやり直すことです。あなたは以下から始めます：

var curElement = document.getElementById("para");

そして、期待どおりにp要素を取得します。しかし、次に、p要素の子を取得しようとしますが、このコードを使用します

curElement = document.firstChild;

取得するのは、ドキュメント自体の最初の子です（つまり、ルートhtml要素を意味します！）。

代わりに、次のようにナビゲートする必要があります。

curElement = curElement.firstChild;

試してみる。

于 2013-02-27T09:40:33.537 に答える
0

NodeNameのノードはHTML要素<html>、つまりdocument.firstChild。HTML要素、つまりDOM要素ノードを反復処理しているため、テキストノードは取得されません。MDNでこれについてもう少し。

コード自体は、と呼ばれる変数を処理しcurElementます。これは、これらがコンテンツではなく要素ノードであることを期待していることを示しています。

要素ノード内にあるノードを取得するchildNodesには、任意ののを取得することをお勧めしますcurElement。

于 2013-02-27T09:41:00.403 に答える