javascript xml文書処理
4503 ワード
先日、javascriptのxml解析に関する知識を知りました.ここで少し記録します.ここでは主にIE、Mozilaに対して関連コードの作成とテストを行います.chromeブラウザには関係ないので、chromeブラウザの関連コードが正常に動作しない可能性があります.期間は「JavaScript高級プログラム設計」第15章の関連知識を参考にしました.
chromeブラウザに対する読み取りxmlドキュメントは、XMLtpRequestオブジェクトによって設定される必要があります.chromeブラウザでは、document.implement.creat Documentメソッドにより作成されたDocmentオブジェクトにロード方法が定義されていないため、以下のように取得する必要があります.var xmlhttp=new window.XMLtpRequest()xmlhttp.open(「GET」、file、false);xmlhttp.send(null)xmlDoc=xmlhttp.reponseXML.document Element;
IEはActiveXObjectを通じてxmlドキュメントに対する操作を実現し、Mozilaはdocument.implement.create Documentオブジェクトを介してxmlドキュメントに対する操作を実現する.同時にIEは、ロードとloadXMLの両方の方法を提供し、Mozillaはロード方法のみを提供しています.Mozilaの関連オブジェクトを改造することにより、IEと同じloadXML法を実現することができます.ここで説明するのは、xmlドキュメントの操作対象を作成した後、デフォルトでxmlを読み込むモードは非同期のasync=trueです.ASync=trueが非同期モードの場合、javascriptコードはxmlドキュメントが完全に読み込まれてからコードを実行するまで待つことはありません.xmlドキュメントオブジェクトを使用すると、ドキュメントがまだ完全に読み込まれていない場合があります.同時にIEとMozillaは非同期モードを処理する方式も違っています.1、IEに対して、非同期でファイルをロードする時、readyState属性とトリガonreadystatechangeイベント処理関数を使います.readyState属性の説明は以下の通りです. 0——DOMはまだ情報を初期化していません. 1——DOMはデータをロードしています. 2——DOMはデータのロードを完了しました. 3——DOMはもう使えますが、一部はまだ使えないかもしれません. 4——DOMはすでに完全にロードされています.使用できます.2、Mozillaに対して、非同期でロードする場合も、readyState属性を使用しますが、トリガはonloadイベント処理関数です.ただし、readyState属性の定義は異なります. ‘loading’−DOMはまだデータをロードしています. ‘complettee'——DOMがロードを完了し、使用できます.非同期モードを使用する場合、xmlドキュメントに対する処理は、ロード完了時として該当するイベントハンドラ関数およびreadyStateにおいてマークされるべきで、ロード方法の直後にあるべきではない.async=falseが非同期モードの時、上記の問題を考慮しなくてもいいです.この時は文書が完全にロードされた後、javascriptだけが後のコードを実行し続けます.
以上の二つの問題に対して、Javascriptを使用するためのxml文書の操作はブラウザを考慮することが明らかになっている.このために以下のコードを作成できます.
テスト1、同期モードを使用する場合
chromeブラウザに対する読み取りxmlドキュメントは、XMLtpRequestオブジェクトによって設定される必要があります.chromeブラウザでは、document.implement.creat Documentメソッドにより作成されたDocmentオブジェクトにロード方法が定義されていないため、以下のように取得する必要があります.var xmlhttp=new window.XMLtpRequest()xmlhttp.open(「GET」、file、false);xmlhttp.send(null)xmlDoc=xmlhttp.reponseXML.document Element;
IEはActiveXObjectを通じてxmlドキュメントに対する操作を実現し、Mozilaはdocument.implement.create Documentオブジェクトを介してxmlドキュメントに対する操作を実現する.同時にIEは、ロードとloadXMLの両方の方法を提供し、Mozillaはロード方法のみを提供しています.Mozilaの関連オブジェクトを改造することにより、IEと同じloadXML法を実現することができます.ここで説明するのは、xmlドキュメントの操作対象を作成した後、デフォルトでxmlを読み込むモードは非同期のasync=trueです.ASync=trueが非同期モードの場合、javascriptコードはxmlドキュメントが完全に読み込まれてからコードを実行するまで待つことはありません.xmlドキュメントオブジェクトを使用すると、ドキュメントがまだ完全に読み込まれていない場合があります.同時にIEとMozillaは非同期モードを処理する方式も違っています.1、IEに対して、非同期でファイルをロードする時、readyState属性とトリガonreadystatechangeイベント処理関数を使います.readyState属性の説明は以下の通りです. 0——DOMはまだ情報を初期化していません. 1——DOMはデータをロードしています. 2——DOMはデータのロードを完了しました. 3——DOMはもう使えますが、一部はまだ使えないかもしれません. 4——DOMはすでに完全にロードされています.使用できます.2、Mozillaに対して、非同期でロードする場合も、readyState属性を使用しますが、トリガはonloadイベント処理関数です.ただし、readyState属性の定義は異なります. ‘loading’−DOMはまだデータをロードしています. ‘complettee'——DOMがロードを完了し、使用できます.非同期モードを使用する場合、xmlドキュメントに対する処理は、ロード完了時として該当するイベントハンドラ関数およびreadyStateにおいてマークされるべきで、ロード方法の直後にあるべきではない.async=falseが非同期モードの時、上記の問題を考慮しなくてもいいです.この時は文書が完全にロードされた後、javascriptだけが後のコードを実行し続けます.
以上の二つの問題に対して、Javascriptを使用するためのxml文書の操作はブラウザを考慮することが明らかになっている.このために以下のコードを作成できます.
function XmlDom() {
if (window.ActiveXObject) {
try {
var oXmlDom = new ActiveXObject("Microsoft.XMLDOM");
oXmlDom.async = false;
return oXmlDom;
} catch (oError) {
oError.reason;
}
throw new Error("MSXML is not installed on you system.");
} else if (document.implementation
&& document.implementation.createDocument) {
var oXmlDom = document.implementation.createDocument("", "", null);
oXmlDom.addEventListener("load", function() {
this.__changeReadyState__();
}, false);
/*
* , load xml <br/>
* , oXmlDom xml 。<br/>
* xml :<br/>
* 1、 IE oXmlDom readyState 4 ;
* 2、 Mozilla oXmlDom readyState 'complete' ;
*/
oXmlDom.async = true;
return oXmlDom;
} else {
throw new Error("Your browser doesn't support an XML DOM object.");
}
}
if (Document) {// , Mozilla
Document.prototype.onreadystatechange = null;
Document.prototype.__changeReadyState__ = function() {
if (typeof this.onreadystatechange == 'function') {
this.onreadystatechange();
}
};
Document.prototype.loadXML = function(sXml) {
var oParser = new DOMParser();
var oXmlDom = oParser.parseFromString(sXml, "text/xml");
while (this.firstChild) {
this.removeChild(this.firstChild);
}
for ( var i = 0; i < oXmlDom.childNodes.length; i++) {
var oNewNode = this.importNode(oXmlDom.childNodes[i], true);
this.appendChild(oNewNode);
}
};
Document.prototype.__load__ = Document.prototype.load;
Document.prototype.load = function(sURL) {
this.__load__(sURL);
};
// xml , .xml
// __defineGetter__ Mozilla
Node.prototype.__defineGetter__("xml", function() {
var oSerializer = new XMLSerializer();
return oSerializer.serializeToString(this, "text/xml");
});
}
テストコードは以下の通りですテスト1、同期モードを使用する場合
function test() {
var oXmlDom = XmlDom();
oXmlDom.async = false;
oXmlDom.load("exam1.xml");
alert(oXmlDom.xml);
}
テスト2、非同期モードを使用する場合function test() {
var oXmlDom = XmlDom();
oXmlDom.async = true;
oXmlDom.onreadystatechange = function() {
//IE|FF
if (oXmlDom.readyState == 4 || oXmlDom.readyState == "complete") {
alert(oXmlDom.xml);
}
}
oXmlDom.load("exam1.xml");
}
非同期モードの時もテスト1のコードを使っていたら、戻り値が得られなくなります.