JavaScriptのXMLドキュメント "undefined"

Question

私は私が遊んでいるゲームのアイデアのHTML5実装に取り​​組んでいます。これの一部は当然のことながらコンテンツを格納しており、その中にゲーム内のさまざまな能力のデータや文字などがあります。

特定の文字などの動的コンテンツは後で移動されますが、能力やギアの統計情報などの静的コンテンツのXMLに固執している可能性があります。できるだけ早くXMLを使用してください。

これを行うために、私は戦闘フェイズの開始時に、最初にキャラクター、次にこのキャラクターに関連する能力などをXML文書にロードします。ロードの

var loadXMLFile = function(filename) { 
    req = new XMLHttpRequest(); 
    req.onreadystatechange = function() { 
    return req.responseXML; 
    } 
    req.open("GET", filename, true); 
    req.send(); 
} 

例とデータを操作する：

は、これを行うために、私は、ファイル名を取り「loadXMLFile」機能を、持っているこれで私の意図はした

function Character(id) { 
    doc = loadXMLFile("characters.xml"); 
    characters = doc.getElementsByTagName("Character"); 

続行する前に関数呼び出しが戻り値を待機するようにします。質問のタイトルからわかるように、これは機能しません。 キャッチされない例外TypeError：代わりに、できるだけ早く私は、データを操作しようとして、例の3行目、私は、次のランタイムエラーを受け取り、私はロードし、一例が示しているように

未定義の「getElementsByTagNameの」メソッドを呼び出すことはできません私のコンストラクタ内のこれらのXMLファイルは、XMLファイルを使用してクラスを生成します。したがって、readystatechangeイベントハンドラ内で別の関数を呼び出す構造は、あまり好ましくありません。別のイベントハンドラを作成するために、私はこれを行うどこでもXML読み込みコードを繰り返す必要がありますか？

Answer 1

jQueryまたは別のjavascriptフレームワークを使用することをお勧めします。このような問題を処理する方がはるかに簡単で、多くの時間とコード行を節約できます。別の問題は、ブラウザでの互換性があなたのコードに与えられていないことです。

Answer 2

を変更したい：

req.open("GET", filename, true); 

た：（。続行する前に要求を待つ意味）

req.open("GET", filename, false); 

同期要求を行うには

あなたは何かを返すことはできません。 onreadystatechangeから、コードの一部が間違っています。

あなたは実際の状態がその機能にあるかどうかチェックしていないので、それも間違っています。

基本的にコードは正しくありません。 XMLHttpRequestのチュートリアルサイトを見つけて、コードをコピーすることをお勧めします。

サイドノートとして、なぜ自分の人生を難しくしていますか？ jQueryをインストールして、このすべてのことをあなたに任せましょう。

最後に、jsonはxmlよりも扱いが簡単ですが、それに切り替えることができます。

Answer 3

言及されたコードは、ブラウザ固有の問題です。理想的には、クロスブラウザ互換のJavaScriptベースのフレームワークを使用する必要があります。クロスブラウザーに関連する問題のほとんどを避けることができます。

問題の解決に向けて、getElementsByTagName関数はdoc要素内で使用できません。したがって、コードを次のように変更することができます。

if(doc.getElementsByTagName){ 
    characters = doc.getElementsByTagName("Character"); 
} 

これでエラーは回避されますが、文字要素の取得の問題は解決されません。

XMLをサーバーのJSONに変換し、JSONをクライアントに送信することをお勧めします。 JSONを簡単にトラバースするのは簡単で、クロスブラウザの問題はありません。

function traverseJSON (jsonObj){ 
    for(var value in jsonObj){ 
     if(typeof value == 'function'){//this is to avoid 'remove' function in case of Array, Array object will be available in case of repeating elements in XML. 
      continue; 
     }else if(typeof value == 'object'){ //refers to element in XML 
      traverseJSON(value); 
     }else if(typeof value== 'string'){ //refers to attribute in XML 
     jsonObj[value]; //refers to the attribute value in XML 
     } 
    } 
} 

上記の関数は次のように簡単にJSONを介して通過できる

一つは、入力として、JSONオブジェクトを受け取りJSON、を横断するために使用することができます。