Latest web development tutorials

XML DOM

DOM(ドキュメントオブジェクトモデルドキュメントオブジェクトモデル)は、ドキュメントにアクセスして操作するための標準的な方法を定義します。


XML DOM

XML DOM(XMLドキュメントオブジェクトモデル)は、XML文書にアクセスして操作するための標準的な方法を定義します。

ツリービューのようなXML DOM XML文書。

すべての要素は、DOMツリーを介してアクセスすることができます。 変更またはそれらの内容を削除し、新しい要素を作成することができます。 要素、テキスト、およびそれらの特性はノードであると考えられます。

私たちには、XML DOMのチュートリアルは、XML DOMについての詳細を学ぶことができます。


HTML DOM

HTML DOMは、HTMLドキュメントにアクセスして操作するための標準的な方法を定義します。

すべてのHTMLエレメントは、HTML DOMを介してアクセスすることができます。

私たちにはHTML DOMチュートリアルは、HTML DOMの知識についての詳細を学ぶことができます。 。


クロスブラウザインスタンス - XMLファイルをロード

次の例では、XML文書(「 note.xml 」)のXML DOMオブジェクトを解析するために、その後、JavaScriptを介して、いくつかの情報を抽出するために:

<html>
<body>
<h1>W3Schools Internal Note</h1>
<div>
<b>To:</b> <span id="to"></span><br />
<b>From:</b> <span id="from"></span><br />
<b>Message:</b> <span id="message"></span>
</div>

<script>
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.open("GET","note.xml",false);
xmlhttp.send();
xmlDoc=xmlhttp.responseXML;

document.getElementById("to").innerHTML=
xmlDoc.getElementsByTagName("to")[0].childNodes[0].nodeValue;
document.getElementById("from").innerHTML=
xmlDoc.getElementsByTagName("from")[0].childNodes[0].nodeValue;
document.getElementById("message").innerHTML=
xmlDoc.getElementsByTagName("body")[0].childNodes[0].nodeValue;
</script>

</body>
</html>

»をお試しください


重要な注意!

<へ>のXMLファイル(「note.xml」)の先頭から要素がテキスト「トーベ」を抽出するために、構文は次のとおりです。

getElementsByTagName("to")[0].childNodes[0].nodeValue

でも、XMLファイルは一つだけの要素<に>含まれていることに注意してください、あなたはまだ[0]配列のインデックスを指定する必要があります。 getElementsByTagNameの()メソッドは、配列を返すためです。


クロスブラウザインスタンス - XML文字列をロード

XML文字列の次の例のXML DOMオブジェクトを解析して、[JavaScriptを介して、いくつかの情報を抽出するために:

<html>
<body>
<h1>W3Schools Internal Note</h1>
<div>
<b>To:</b> <span id="to"></span><br />
<b>From:</b> <span id="from"></span><br />
<b>Message:</b> <span id="message"></span>
</div>

<script>
txt="<note>";
txt=txt+"<to>Tove</to>";
txt=txt+"<from>Jani</from>";
txt=txt+"<heading>Reminder</heading>";
txt=txt+"<body>Don't forget me this weekend!</body>";
txt=txt+"</note>";

if (window.DOMParser)
{
parser=new DOMParser();
xmlDoc=parser.parseFromString(txt,"text/xml");
}
else // Internet Explorer
{
xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
xmlDoc.async=false;
xmlDoc.loadXML(txt);
}

document.getElementById("to").innerHTML=
xmlDoc.getElementsByTagName("to")[0].childNodes[0].nodeValue;
document.getElementById("from").innerHTML=
xmlDoc.getElementsByTagName("from")[0].childNodes[0].nodeValue;
document.getElementById("message").innerHTML=
xmlDoc.getElementsByTagName("body")[0].childNodes[0].nodeValue;
</script>
</body>
</html>

»をお試しください