如何使用 jQuery 从 xml 中查找/提取数据答案

【问题标题】：How to find/extract data from xml with jQuery如何使用 jQuery 从 xml 中查找/提取数据
【发布时间】：2011-02-03 12:30:23
【问题描述】：

我正在尝试从下面的 xml 中提取 StateLongName 和 StateShortName 值。

我知道必须有一种简单优雅的方式来使用 jQuery 来做到这一点。

<NewDataSet>
  <Table>
    <StateLongName>Alabama</StateLongName>
    <StateShortName>AL</StateShortName>
  </Table>
  <Table>
    <StateLongName>Alaska</StateLongName>
    <StateShortName>AK</StateShortName>
  </Table>

...elments removed for brevity

</NewDataSet>

这是我尝试过的。

将上面的 xml 加载到 Javascript 变量名 xml 中。

尝试#1

$(xml).find("TABLE").each(function()
{
  var stateName = $(this).find("StateLongName").innerText;
  var stateCode = $(this).find("StateShortName").innerText;
});

尝试 #1 没有找到任何东西，并且永远不会进入内部加载 stateName 和 stateCode 变量。

尝试#2

$(xml).find("StateLongName").each(function()
{
  var stateName = $(this).find("StateLongName").innerText;
  var stateCode = $(this).find("StateShortName").innerText;
});

尝试 #2 确实找到匹配项，但是 stateName 和 stateCode 未定义。

尝试#3

$(xml).find("StateLongName").each(function()
{
  var stateName = $($(xml).find('StateLongName').parent()[0].innerHTML)[1].data;
  var stateCode = $($(xml).find('StateLongName').parent()[0].innerHTML)[5].data;
});

尝试 #3 可行，但必须有更好的方法。请赐教。

感谢您的宝贵时间！

【问题讨论】：

忽略我的回答 - 我认为你的问题更笼统！

标签： jquery xml

【解决方案1】：

区分大小写，像这样使用"Table"：

$(xml).find("Table").each(function() {
  var stateName = $(this).find("StateLongName").text();
  var stateCode = $(this).find("StateShortName").text();
});

更新：抱歉，这个有点莫名其妙，不要使用<table>，它会将其视为创建<tbody> 的html，并且从那里开始变得陌生：) 如果您将其更改为仅邻接其他任何东西，它会起作用的，这是一个将其更改为<tabl>的示例：http://jsfiddle.net/Yvetc/

这是一个完整的测试页面：

<html>
  <head>    
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
    <script type="text/javascript">
    var xml="<NewDataSet><Tabl><stateLongName>Alabama</stateLongName><stateShortName>AL</StateShortName></Tabl><Tabl><StateLongName>Alaska</StateLongName><StateShortName>AK</StateShortName></Tabl></NewDataSet>";
    $(xml).find("Tabl").each(function() {
      var stateName = $(this).find("StateLongName").text();
      var stateCode = $(this).find("StateShortName").text();
      alert("State: " + stateName + " Code: " + stateCode);
    });
    </script>
  </head>
  <body>
  </body>
</html>

【讨论】：

我喜欢在多次使用该值时定义var $this = $(this)。
感谢尼克的快速回复。不幸的是，更改大小写仍然没有找到任何匹配项。
看来区分大小写不适用于 .find() 方法。 $(xml).find("statelongname") 的任何大小写版本都将匹配，而 $(xml).find("table") 的任何字符大小写版本都将不匹配。
这种行为是浏览器特有的吗？ Nick 的原始示例适用于我在 Chrome 上的 jsfiddle.net/k9yfa。
@Anurag - 因为我将 xml 更改为不包含 <table> 而是包含 <tabl>，这似乎在文档片段中搞砸了很多东西。

【解决方案2】：

$.ajax({
             type: "GET",
             url: "labels.xml",
             dataType: "xml",
             success: function(xml) {
                 $(xml).find('label').each(function(){
                     var id_text = $(this).attr('id')
                     var name_text = $(this).find('name').text()

                     $('<li></li>')
                         .html(name_text + ' (' + id_text + ')')
                         .appendTo('#update-target ol');
                 }); //close each(
             }
         }); //close $.ajax(

为此的示例 xml：

<?xml version="1.0" encoding="iso-8859-1"?>


<labels>
   <label id='ep' added="2003-06-10">
     <name>Ezra Pound</name>
     <address>
       <street>45 Usura Place</street>
       <city>Hailey</city>
       <province>ID</province>
     </address>
   </label>
   <label id='tse' added="2003-06-20">
     <name>Thomas Eliot</name>
     <address>
       <street>3 Prufrock Lane</street>
       <city>Stamford</city>
       <province>CT</province>
     </address>
   </label>
   <label id="lh" added="2004-11-01">
     <name>Langston Hughes</name>
     <address>
       <street>10 Bridge Tunnel</street>
       <city>Harlem</city>
       <province>NY</province>
     </address>
   </label>
   <label id="co" added="2004-11-15">
     <name>Christopher Okigbo</name>
     <address>
       <street>7 Heaven's Gate</street>
       <city>Idoto</city>
       <province>Anambra</province>
     </address>
   </label>
 </labels>

【讨论】：