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/