如何使用 jQuery 解析 XML？答案

【问题标题】：How to parse XML using jQuery?如何使用 jQuery 解析 XML？
【发布时间】：2011-08-29 09:04:22
【问题描述】：

如何解析 XML，如何使用 jQuery 导航结果？这是我的示例 XML：

<Pages>
  <Page Name="test">
    <controls>
      <test>this is a test.</test>
    </controls>
  </Page>
  <Page Name = "User">
    <controls>
      <name>Sunil</name>
    </controls>
  </Page>
</Pages>

我想通过这条路径找到节点 Pages -> Page Name -> controls -> test ？

【问题讨论】：

如何使用此层次结构 Pages->pagename->controls->test 找到节点的详细信息是什么意思？请澄清。另请注意Page !== page.

标签： javascript jquery xml

【解决方案1】：

为此有$.parseXML 函数：http://api.jquery.com/jQuery.parseXML/

你可以这样使用它：

var xml = $.parseXML(yourfile.xml),
  $xml = $( xml ),
  $test = $xml.find('test');

console.log($test.text());

如果你真的想要一个对象，你需要一个插件。例如，此插件会将您的 XML 转换为 JSON：http://www.fyneworks.com/jquery/xml-to-json/

【讨论】：

Gosh... 问题是“如何使用此层次结构 Pages->pagename->controls->test 找到节点的详细信息？”不是“我如何解析 XML 文件”我是对的还是对的？
没有插件就不可能，请参阅我的编辑。编辑啊，你不是问这个问题的人。您当然是对的，但这并不意味着我们不能提出其他建议。
@WTK：题目是如何使用jquery解析xml。 OP与另一句话是什么意思，我其实不知道...
嗨， $xml = $( xml ) 行的确切含义是什么？

【解决方案2】：

你可以使用.parseXML

var xml='<Pages>
          <Page Name="test">
           <controls>
              <test>this is a test.</test>
           </controls>  
          </Page>
          <page Name = "User">
           <controls>
             <name>Sunil</name>
           </controls>
          </page>
        </Pages>';

jquery

    xmlDoc = $.parseXML( xml ),
    $xml = $( xmlDoc );
    $($xml).each(function(){
       alert($(this).find("Page[Name]>controls>name").text());
     });

这是小提琴http://jsfiddle.net/R37mC/1/

【讨论】：

注意：您需要在 XML 行的末尾添加反斜杠，否则 Javascript 解释器不会接受它作为一个字符串。
@Jens Roland 是的，但在小提琴中我删除了空格，并 tnx 获取信息

【解决方案3】：

我假设您正在从外部文件加载 XML。使用$.ajax()，其实很简单：

$.ajax({
    url: 'xmlfile.xml',
    dataType: 'xml',
    success: function(data){
        // Extract relevant data from XML
        var xml_node = $('Pages',data);
        console.log( xml_node.find('Page[Name="test"] > controls > test').text() );
    },
    error: function(data){
        console.log('Error loading XML data');
    }
});

此外，您应该对 XML 节点命名保持一致。您有小写和大写的节点名称（<Page> 与 <page>），当您尝试使用 XML 树选择器时可能会造成混淆。

【讨论】：

【解决方案4】：

$xml = $( $.parseXML( xml ) );

$xml.find("<<your_xml_tag_name>>").each(function(index,elem){
    // elem = found XML element
});

【讨论】：

这个方案真的不错，能不能用完整的代码改进一下？非常感谢！ +1

【解决方案5】：

看看 jQuery 的 .parseXML() ^[docs]:

var $xml = $(jQuery.parseXML(xml));

var $test = $xml.find('Page[Name="test"] > controls > test');

【讨论】：

【解决方案6】：

我沿用了 jQuery 的 .parseXML()，但发现 'Page[Name="test"] > controls > test' 的 XML 路径语法不起作用（如果有人知道为什么，请大声说出来！）。

相反，我将单个 .find() 结果链接在一起，看起来像这样：

$xmlDoc.find('Page[Name="test"]')
       .find('contols')
       .find('test')

结果与我预期的一次性找到的结果相同。

【讨论】：

【解决方案7】：

在谷歌搜索结果中弹出的第一件事http://think2loud.com/224-reading-xml-with-jquery/ 在没有任何插件的情况下，没有简单的方法可以在 jQuery 中访问 xml 结构（就像您描述的 Pages->pagename->controls->test）。

【讨论】：