jQueryでxml子ノードの属性を取得する

Question

私はこの問題を解決するために、コードを削除して物事を壊してしまったためです。私は特定の教会の画像を見たいだけです。

xmlファイル：

<churches> 
<church> 
     <data-name>germanevangelical</data-name> 
     <name>German Evangelical</name> 
     <address>501 Elm St.</address> 
     <opened>1887</opened> 
     <neighborhood>East</neighborhood> 
     <region>East</region> 
     <architecture>Gothic</architecture> 
     <denomination>Evangelical Lutheran</denomination> 
     <closed>2006</closed> 
     <image caption="Mary Smith">image_1_forweb.jpg</image> 
     <image caption="Mary Smith">image_2_forweb.jpg</image> 
     <image caption="Mary Smith">image_3_forweb.jpg</image> 
</church> 
... (more church nodes) 
</churches> 

私はjQueryを使って画像のキャプションにアクセスしたいです。ここで

は私のコードですが、それはキャプションに「未定義」を返すだ：

var cName = 'germanevangelical'; 
$.ajax({ 
       type: "GET", 
       url: "churchdata.xml", 
       dataType: "xml", 
       success: function(xml) { 
       var name = $(xml).find("data-name"); //get church names from xml file 
       $(name).each(function(id, item) { 
        if ($(item).text() == cName) { //find the right church in the xml file 
         $(item).parent().find("image").each(function(id, node) { 
          console.log('id: ' + $(node).attr('caption'));//undefined 
         }) 
        }//end if right church in xml file 
       }) 
       } 
      }); 

誰も私が間違ってやっているかを見ることができますしてください？

Answer 1

解析中にajaxコードに間違いがありますが、 "data-name"を見つけるときに$ xmlの代わりに$ xmlを使用してください。以下のコードをチェックしてください。あなたのページをクロームで実行し、デベロッパーツールにエラーがないかどうかチェックしてください。

var cName = 'germanevangelical'; 
$.ajax({ 
type: "GET", 
    url: "churchdata.xml", 
    dataType: "xml", 
    success: function (xml) { 
    var xmlDoc = $.parseXML(xml), 
    $xml = $(xmlDoc); 
    var name = $xml.find("data-name"); //get church names from xml file 
     $(name).each(function(id,item) { 
       if ($(item).text() == cName) { 
       $(item).parent().find("image").each(function(id,node) { 
        console.log('id: ' + $(node).attr('caption')); //undefined 
       }); 
       } 
     }); 
     } 
}); 

Answer 2

$.parseXML()$.ajax()でdataTypeが"xml"に設定されている場合XMLDocumentが$.ajax()コールのsuccessでxmlとして返されるべきであり、必要ではありません。

また、)での.each()の終了は、質問でjavascriptを呼び出します。

$.ajax({ 
    type: "GET", 
    url: "churchdata.xml", 
    dataType: "xml", 
    success: function(xml) { 
    console.log(xml); 
    var name = $(xml).find("data-name"); //get church names from xml file 
    $(name).each(function(id, item) { 
     $(item).parent().find("image").each(function(id, node) { 
     console.log('id: ' + $(node).attr('caption')); 
     }) 
    }) 
    } 
}); 

plnkr http://plnkr.co/edit/HYaaxN0EY0JtkciBMJpl?p=preview