jQuery如何定义对象结构？答案

【问题标题】：How jQuery define object structure?jQuery如何定义对象结构？
【发布时间】：2012-05-16 13:26:00
【问题描述】：

嗯，这个问题让我很生气。我认为我在这方面缺乏知识。

我正在尝试解析 XML 响应，一切正常，但问题是当我尝试访问对象时。我将它们视为数组，我总是收到“未定义”：

<?xml version="1.0" encoding="UTF-8" ?>
  <ajax-response>
   <response>
    <item>
      <name><![CDATA[ok]]></name>
      <value><![CDATA[true]]></value>
    </item>
    <item>
      <name><![CDATA[menuDiv]]></name>
      <value><![CDATA[Some HTML value]]></value>
    </item>
   </response>
  </ajax-response>

这里是 Jquery 代码：

xmlDoc = $.parseXML( xml ),
        $xml = $( xmlDoc ),
        $item = $xml.find( "item" );
        alert($item.length);
        $item.each(function(key, value){ 
            alert(typeof value);     
        });

这一行alert(typeof value); 返回“对象”。但是，如果我这样做 value[0] 或 $value[0] 它会返回“未定义”。

我想从对象中获取“一些 HTML 值”。

【问题讨论】：

标签： jquery object xml-parsing

【解决方案1】：

传递给您的迭代函数的value 对象将是一个XML DOM 节点，在您的例子中是一个Element，标签名称为item。因此，您可以通过从中获取属性或查看其拥有的任何子 TextNodes 中的文本来从中检索信息。

您可以将元素包装在 jQuery 实例中，并使用 jQuery 的 attr 获取属性，并使用 text 获取文本。

我想从对象中获取“一些 HTML 值”。

那就是text——这是一个例子：

$item.each(function(key, value){ 
    var $value = $(value);
    alert(typeof $value.text());
});

这是一个完整的示例，它遍历每个 item 的子代：Live copy | source

jQuery(function($) {

  var xml =
      '<?xml version="1.0" encoding="UTF-8" ?>' +
      '<ajax-response>' +
          '<response>' +
              '<item>' +
                  '<name><![CDATA[ok]]></name>' +
                  '<value><![CDATA[true]]></value>' +
              '</item>' +
              '<item>' +
                  '<name><![CDATA[menuDiv]]></name>' +
                  '<value><![CDATA[Some HTML value]]></value>' +
              '</item>' +
          '</response>' +
      '</ajax-response>';

  var xmlDoc = $.parseXML( xml ),
      $xml = $( xmlDoc ),
      $item = $xml.find( "item" );
  display($item.length);
  $item.each(function(key, value){ 
    $(value).children().each(function(clave, valor) {
      display("$(valor).text() = " + $(valor).text());
    });
  });

  function display(msg) {
    $("<p>").html(msg).appendTo(document.body);
  }
});

或者，如果您只想获取包含文本 "menuDiv" 的 name 的兄弟 value，则相关位是：

var menuDivText = $xml.find("item name:contains(menuDiv)").next().text();

Live example | source

【讨论】：

非常感谢！现在我可以访问另一个实例，但是如何从该对象中获取“一些 HTML 值”？因为这对于我将采用“一些 HTML 值”的步骤很有用。现在我正在尝试：$item.each(function(key, value){ $(value).each(function(clave, valor){ alert($(valor).text()); }); });，但它返回两个值：<name><![CDATA[ok]]></name> <value><![CDATA[true]]></value>
@LeandroCusack: $(value).each(...) 循环通过匹配集中的每个 item 对象（所以它循环一次）。如果你想遍历它的 child 节点，使用$(value).children().each(...)。示例：jsbin.com/iwonoq
谢谢，非常好的答案。问题是这不是关联的，如果是“menuDiv”，我会假装选择内容。 PHP在这方面的规则。
@LeandroCusack：我认为您只需要花一些时间阅读the jQuery API。它非常强大。
@LeandroCusack：例如，看看最后的编辑（最后）。