XMLチュートリアル

XMLホーム XMLの紹介 XML使用方法 XMLツリー XML構文 XML要素 XML属性 XML名前空間 XML表示 XML HttpRequest XMLパーサー XML DOM XML XPath XML XSLT XML XQuery XML XLink XMLバリデーター XML DTD XMLスキーマ XMLサーバー XMLの例 XMLクイズ XML証明書

XML AJAX

AJAXの紹介 AJAX XMLHttp AJAXリクエスト AJAX応答 AJAXXMLファイル AJAX PHP AJAX ASP AJAXデータベース AJAXアプリケーション AJAXの例

XML DOM

DOMの紹介 DOMノード DOMアクセス DOMノード情報 DOMノードリスト DOMトラバース DOMナビゲーション DOMは値を取得します DOM変更ノード DOM削除ノード DOM置換ノード DOM作成ノード DOM追加ノード DOMクローンノード DOMの例

XPathチュートリアル

XPathの概要 XPathノード XPath構文 XPath軸 XPath演算子 XPathの例

XSLTチュートリアル

XSLTの紹介 XSL言語 XSLT変換 XSLT <テンプレート> XSLT <値> XSLT <for-each> XSLT <ソート> XSLT <if> XSLT <選択> XSLT適用 クライアント上のXSLT サーバー上のXSLT XSLT Edit XML XSLTの例

XQueryチュートリアル

XQueryの紹介 XQueryの例 XQuery FLWOR XQuery HTML XQueryの用語 XQuery構文 XQuery追加 XQuery Select XQuery関数

XML DTD

DTDの紹介 DTDビルディングブロック DTD要素 DTD属性 DTD要素と属性 DTDエンティティ DTDの例

XSDスキーマ

XSDの概要 XSDハウツー XSD <スキーマ> XSD要素 XSD属性 XSDの制限

XSDコンプレックス

XSD要素 XSDが空です XSD要素のみ XSDテキストのみ XSD混合 XSDインジケーター XSD <任意> XSD <anyAttribute> XSD置換 XSDの例

XSDデータ

XSD文字列 XSD日付 XSD数値 XSDその他 XSDリファレンス

Webサービス

XMLサービス XML WSDL XML SOAP XML RDF XML RSS

参考文献

DOMノードタイプ DOMノード DOM NodeList DOM NamedNodeMap DOMドキュメント DOM要素 DOM属性 DOMテキスト DOM CDATA DOMコメント DOM XMLHttpRequest DOMパーサー XSLT要素 XSLT / XPath関数

XMLDOM-ノードのナビゲート


ノードは、ノード関係を使用してナビゲートできます。

×

Header


DOMノードのナビゲート

ノード間の関係を介してノードツリー内のノードにアクセスすることは、「ナビゲーションノード」と呼ばれることがよくあります。

XML DOMでは、ノードの関係はノードのプロパティとして定義されます。

  • parentNode
  • childNodes
  • 第一子
  • 最後の子
  • nextSibling
  • previousSibling

次の画像は、ノードツリーの一部とbooks.xml内のノード間の関係を示しています。

ノードツリー


DOM-親ノード

すべてのノードには、親ノードが1つだけあります。次のコードは、<book>の親ノードに移動します。

function myFunction(xml) {
var xmlDoc = xml.responseXML;
    var x = xmlDoc.getElementsByTagName("book")[0];
    document.getElementById("demo").innerHTML = x.parentNode.nodeName;
}

説明された例:

  1. books.xml」をxmlDocに ロードします
  2. 最初の<book>要素を取得します
  3. 「x」の親ノードのノード名を出力します


空のテキストノードを避ける

Firefoxやその他のブラウザは、空の空白や新しい行をテキストノードとして扱いますが、InternetExplorerは扱いません。

これにより、プロパティ(firstChild、lastChild、nextSibling、previousSibling)を使用するときに問題が発生します。

空のテキストノード(要素ノード間のスペースと改行文字)への移動を回避するために、ノードタイプをチェックする関数を使用します。

function get_nextSibling(n) {
    var y = n.nextSibling;
    while (y.nodeType! = 1) {
        y = y.nextSibling;
    }
    return y;
}

上記の関数を使用すると、プロパティnode .nextSiblingの代わりにget_nextSibling( node )を使用できます。

コードの説明:

要素ノードはタイプ1です。兄弟ノードが要素ノードでない場合、要素ノードが見つかるまで次のノードに移動します。このように、結果はInternetExplorerとFirefoxの両方で同じになります。


最初の子要素を取得する

次のコードは、最初の<book>の最初の要素ノードを表示します。

<!DOCTYPE html>
<html>
<body>

<p id="demo"></p>

<script>
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
        myFunction(this);
    }
};
xhttp.open("GET", "books.xml", true);
xhttp.send();

function myFunction(xml) {
    var xmlDoc = xml.responseXML;
    var x = get_firstChild(xmlDoc.getElementsByTagName("book")[0]);
    document.getElementById("demo").innerHTML = x.nodeName;
}

//check if the first node is an element node
function get_firstChild(n) {
    var y = n.firstChild;
    while (y.nodeType != 1) {
        y = y.nextSibling;
    }
    return y;
}
</script>

</body>
</html>

出力:

title

説明された例:

  1. books.xml」をxmlDocに ロードします
  2. 最初の<book>要素ノードでget_firstChild関数を使用して、要素ノードである最初の子ノードを取得します
  3. 要素ノードである最初の子ノードのノード名を出力します

その他の例


この例では、lastChild()メソッドとカスタム関数を使用して、ノードの最後の子ノードを取得します


この例では、nextSibling()メソッドとカスタム関数を使用して、ノードの次の兄弟ノードを取得します


この例では、previousSibling()メソッドとカスタム関数を使用して、ノードの前の兄弟ノードを取得します