jquery - jQuery 获取 XML 到列表样式

Question

我有这样的 XML 文件。

<products>
 <product>
  <name>Product title</name>
  <items>
   <item>AB123</item>
   <item>BC456</item>
   <item>CD6543</item>
  </items>
 </product>
 <product>
  <name>Product title</name>
  <items>
   <item>AB123</item>
   <item>BC456</item>
   <item>CD6543</item>
  </items>
 </product>
</products>

我怎样才能轻松，用 jQuery 将其转换为页面上的列表样式？

我的文件名为 products.xml

<ul>
 <li>Product title
  <ul>
   <li>AB1234</li>
   <li>BC456</li>
   <li>CD6543</li>
  </ul>
 </li>
 <li>Product title
  <ul>
   <li>AB1234</li>
   <li>BC456</li>
   <li>CD6543</li>
  </ul>
 </li>
</ul>

任何帮助是极大的赞赏！谢谢！

Answer 1

可能是这样的

var products = $('<ul>');

$(xml).find('product').each(function () {
    var li = $('<li>'),
        self = $(this);
    li.text(self.find('name').text());

    var children = $('<ul>'),
        items = self.find('item');

    items.each(function () {
        children.append($('<li>').text($(this).text()));
    });
    li.append(children);
    products.append(li);
});

$('body').append(products);

演示在http://jsfiddle.net/gaby/MdEkg/