Question

<resultsPage status="ok">
      <results>
        <artist displayName="someName">
           <identifier eventsHref="somelink">
           </identifier>
           <identifier eventsHref="somelink">
           </identifier>

        </artist> 
        <artist displayName="someName">
           <identifier eventsHref="someName">
           </identifier>
        </artist> 
        <artist someattributes>
        </artist> 
      </results>
</resultsPage>

所以我有这个xml文件。所以我想做的事情是首先检索并显示每个艺术家的“displayName”，然后为每个艺术家元素显示所有标识符的“eventsHref”。这是我写的javascript中的代码，所以我可以从artist元素中获取每个displayName。

x=xmlDoc.documentElement;
events=xmlDoc.getElementsByTagName("artist");
for (i=0;i<events.length;i++)
{
    event=events[i].getAttribute("displayName");

    document.write(event+"<br>");       
}

Answer 1

你可以使用jQuery，方法如下：我假设您的javascript文件正在读取外部xml文档，因此您可以执行$ .ajax来获取文件的内容：

 $.ajax({
        type: 'get',
        url: 'pathtoTheFile.xml',
        async: false, 
        dataType: 'xml', 
        success: function(data){
            getData(data);
        }, 
        error: function(data){
            console.log("error");
        }
    });

一旦你有xml数据调用函数getData：

  function getData(data){

     var DisplayNameArray = []; 
     var eventsHrefArray = [];  

     $(data).find('artist').each(function(){
         DisplayNameArray.push($(this).attr('displayName'));

         $(this).find('identifier').each(function(){
             eventsHrefArray.push($(this).attr('eventsHref'));
         })
     }); 

     console.log(DisplayNameArray); 
     console.log(eventsHrefArray); 

 }

该函数在DisplayNameArray中存储'displayName'的值，在eventsHrefArray中存储'eventsHref'的值。然后，您可以使用数据执行任何操作，包括将其添加到页面中。

对于xml示例，您提供的数组内容为：

  console.log(DisplayNameArray);    
  >>["someName", "someName"] 
   console.log(eventsHrefArray);    
  >>["somelink", "somelink", "someName"]

PS：最后的xml文件中有错误

编辑：如果你想基于displayName将数据元素eventsHref分开，那就很简单了。但是在这种情况下，数据元素不能存储在数组中我宁愿使用java对象（类似JSON的结构）。

    function getData(data){

     var myData = []; 
     var tmpData = {displayName: '', eventsHref: []}; //initialize a temporary object   

     $(data).find('artist').each(function(){
         tmpData.displayName = $(this).attr('displayName');

         $(this).find('identifier').each(function(){
             tmpData.eventsHref.push($(this).attr('eventsHref'));
         })


            myData.push(tmpData); 
            tmpData = {displayName: '', eventsHref: []};
     }); 

     //do something with the data here: 
     console.log(myData); 
 }

现在您可以通过这种方式访问每个displayName：

  myData[0].displayName; //of course you will have to go through the array to print the list for instance.

您可以通过以下方式访问与该displayName相关的eventsHref列表：

  myData[0].eventsHref;

对于您提供的xml示例，打印myData的内容（在删除xml文件中的错误之后）将给出：

 [{"displayName":"someName","eventsHref":["somelink","somelink"]},{"displayName":"someName","eventsHref":["someName"]}];

希望这会有所帮助。

使用javascript从xml文件中检索元素的属性

1 个答案: