DOM ナビゲーション
XML DOM - ナビゲーションノード
を使用すると、ノード間の関係を使用してノードをナビゲートできます。
DOM ノードのナビゲート
ノード間の関係 (通常は「ノードのナビゲート」と呼ばれます) を通じてノード ツリー内のノードにアクセスします。
XML DOM では、ノードの関係はノードの属性として定義されます。
前の兄弟
-
下の画像は
books.xml のノードツリーのセクションを示し、ノード間の関係を示しています: DOM - 親ノード
すべてのノードには親ノードが1つだけあります。次のコードは、<book> の親ノードに移動します: - インスタンス
<!DOCTYPE html> <html> <head> <script src="loadxmldoc.js"> </script> </head> <body> <script> xmlDoc=loadXMLDoc("books.xml"); x=xmlDoc.getElementsByTagName("book")[0]; document.write(x.parentNode.nodeName); </script> </body> </html>インスタンスの実行»
「インスタンスの実行」ボタンをクリックしてオンラインインスタンスを表示します
インスタンスの説明:
loadXMLDoc( ) を使用します。「books.xml」を xmlDoc にロードし、最初の <book> 要素を取得します。Firefox および他の一部のブラウザーは空の空白または改行をテキスト ノードとして扱いますが、Internet Explorer は扱いません。 これにより、firstChild、lastChild、nextSibling、previousSibling のプロパティを使用するときに問題が発生します。 空のテキスト ノード (要素ノード間のスペースと改行) への移動を避けるために、関数を使用してノード タイプをチェックします: }
- 上記の関数を使用すると、
- node
.nextSibling プロパティの代わりに get_nextSibling(
node ) を使用できます。 コードの説明:
要素ノードのタイプは1です。兄弟ノードが要素ノードでない場合は、要素ノードが見つかるまで次のノードに移動します。このようにすると、Internet Explorer と Firefox の両方で同じ結果が得られます。 - 最初の子要素を取得します
インスタンス
<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js">
</script>
<script>
//check if the first node is an element node
function get_firstChild(n)
{
y=n.firstChild;
while (y.nodeType!=1)
{
y=y.nextSibling;
}
return y;
}
</script>
</head>
<body>
<script>
xmlDoc=loadXMLDoc("books.xml");
x=get_firstChild(xmlDoc.getElementsByTagName("book")[0]);
document.write(x.nodeName);
</script>
</body>
</html>インスタンスの実行»
オンラインで表示するには、[インスタンスの実行] ボタンをクリックします例
インスタンスの実行»
インスタンスの実行»
インスタンスの実行»
例の説明:
loadXMLDoc()を使用して「books.xml」をxmlDocにロードします
最初の<book>要素でget_firstChild関数を使用して、(要素ノードに属する)最初の子ノードを取得します。 )
最初の子ノード(要素ノードに属する)のノード名を出力します
その他の例
lastChild()
この例では、lastChild()メソッドとカスタムノードの最後の子ノードを取得する関数
インスタンス
<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js">
</script>
<script>
//check if the first node is an element node
function get_lastChild(n)
{
y=n.lastChild;
while (y.nodeType!=1)
{
y=y.previousSibling;
}
return y;
}
</script>
</head>
<body>
<script>
xmlDoc=loadXMLDoc("books.xml");
x=get_lastChild(xmlDoc.getElementsByTagName("book")[0]);
document.write(x.nodeName);
</script>
</body>
</html>インスタンスの実行»
「インスタンスの実行」ボタンをクリックしてオンラインインスタンスを表示します
nextSibling()
この例では使用しますnextSibling() メソッドと、ノードの次の兄弟ノードを取得するカスタム関数
インスタンス
<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js">
</script>
<script>
//check if the first node is an element node
function get_nextSibling(n)
{
y=n.nextSibling;
while (y.nodeType!=1)
{
y=y.nextSibling;
}
return y;
}
</script>
</head>
<body>
<script>
xmlDoc=loadXMLDoc("books.xml");
x=get_nextSibling(xmlDoc.getElementsByTagName("title")[0]);
document.write(x.nodeName);
</script>
</body>
</html>インスタンスの実行»
オンライン インスタンスを表示するには、[インスタンスの実行] ボタンをクリックします
previousSibling()
この例previousSibling() メソッドとカスタム関数を使用して、ノードの前の兄弟ノードを取得します
Instance
<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js">
</script>
<script>
//check if the first node is an element node
function get_previousSibling(n)
{
y=n.previousSibling;
while (y.nodeType!=1)
{
y=y.previousSibling;
}
return y;
}
</script>
</head>
<body>
<script>
xmlDoc=loadXMLDoc("books.xml");
x=get_previousSibling(xmlDoc.getElementsByTagName("price")[0]);
document.write(x.nodeName);
</script>
</body>
</html>インスタンスの実行»
オンラインで表示するには、[インスタンスの実行] ボタンをクリックしますインスタンス
