使用 jQuery 的 XML 到 javascript 数组

Posted 2023-02-22

【中文标题】使用 jQuery 的 XML 到 javascript 数组

【英文标题】：XML to javascript array with jQuery

【发布时间】：2011-09-26 09:32:42

【问题描述】：

我是 XML 和 AJAX 的新手，我只是 javascript 和 jQuery 的新手。在其他工作职责中，我设计了我们的网站。截止日期很近，我能想到的唯一能做好这个项目的方法就是使用 AJAX。我有一个充满 XML 对象的文档，例如这个重复：

<item>
    <subject></subject>
    <date></date>
    <thumb></thumb>
</item>

我想创建一个包含所有元素及其子元素的数组。我已经阅读关于 AJAX 的 jQuery 教程好几个小时了，甚至不知道从哪里开始，因为它们都假定了一定程度的 javascript 熟练程度。如果有人可以向我展示循环所有元素并将其子元素放入数组中的最简单方法，我将不胜感激。

【问题讨论】：

请描述结果数组的所需结构。

XML 本质上是分层的，数组是线性的。你打算如何解决这个问题？ （在你决定如何做某事之前，你最好弄清楚你要做什么）

我不知道该如何解决这个问题。我有一个 XML 文件，其中包含将被读取并转换为 html 并显示在首页上的新闻项目。理想情况下，我希望每个 成为对象数组中的 javascript 对象。这种数组用javascript不可能吗？

【参考方案1】：

使用 jQuery，$.ajax() 您的 XML 文件，并在成功时使用 each 传递检索到的数据，例如：

 var tmpSubject, tmpDate, tmpThumb;
 $.ajax(
            url: '/your_file.xml',
            type: 'GET', 
            dataType: 'xml',
            success: function(returnedXMLResponse)
                $('item', returnedXMLResponse).each(function()
                     tmpSubject = $('subject', this).text();
                     tmpDate = $('date', this).text();
                     tmpThumb = $('thumb', this).text();
                    //Here you can do anything you want with those temporary
                    //variables, e.g. put them in some place in your html document
                    //or store them in an associative array
                )
              
        ); 

【讨论】：

谢谢！还没有测试，但它是有道理的。如果我有一个很大的 XML 文档，并且每次调用它时都不需要所有 XML 数据，那么使用 .ajax() 函数会比 .parseXML() 函数获得更好的性能吗？

【参考方案2】：

我写了这个.. 非常简单的方法来获取格式良好的 XML 响应/字符串并用 jquery 解析它，然后转换为数组。

var response = '<?xml version="1.0" encoding="UTF-8"?><root><node1>something</node1></root>'  

var xmlDoc = $.parseXML( response );

var myArray = getXMLToArray(xmlDoc);

alert(myArray['root']['node1']);
//Pop up window displaying the text "something"

function getXMLToArray(xmlDoc)
    var thisArray = new Array();
    //Check XML doc
    if($(xmlDoc).children().length > 0)
    //Foreach Node found
    $(xmlDoc).children().each(function()    
        if($(xmlDoc).find(this.nodeName).children().length > 0)
        //If it has children recursively get the inner array
        var NextNode = $(xmlDoc).find(this.nodeName);
        thisArray[this.nodeName] = getXMLToArray(NextNode);
         else 
        //If not then store the next value to the current array
        thisArray[this.nodeName] = $(xmlDoc).find(this.nodeName).text();
        
    );
    
    return thisArray;

希望这会有所帮助！

【参考方案3】：

如果您使用的是 jQuery，那么 parseXML 会将整个 xml 文档吸入一个可用的数据结构中。

【参考方案4】：

我添加到你的脚本Troublesum

function getXMLToArray(xmlDoc)
  var thisArray = new Array();
  //Check XML doc
  if($(xmlDoc).children().length > 0)
    //Foreach Node found
    $(xmlDoc).children().each(function()
      if($(xmlDoc).find(this.nodeName).children().length > 0)
        //If it has children recursively get the inner array
        var NextNode = $(xmlDoc).find(this.nodeName);
        thisArray[this.nodeName] = getXMLToArray(NextNode);
       else 
        //If not then store the next value to the current array
        thisArray[this.nodeName] = [];
        $(xmlDoc).children(this.nodeName).each(function()
          thisArray[this.nodeName].push($(this).text());
        );
      
    );
  
  return thisArray;

它现在还支持在 XML 中具有相同名称的许多子项。 f.e

XML 存在

<countries>  
  <NL>   
    <borders>
      <country>Germany</country>
      <country>Belgium</country>

countries.NL.borders[1] 将给德国。