javascript - 使用 jQuery 循环遍历 XML 属性和元素

Question

我搜索了大部分论坛，但找不到我要找的东西。我想做以下事情:

XML 文件:

<vaardigheden>
 <vaardigheid soort="techniek">HTML/CSS</vaardigheid>
 <vaardigheid soort="techniek">PHP/MySQL</vaardigheid>
 <vaardigheid soort="techniek">Javascript</vaardigheid>
 <vaardigheid soort="Instrument">Drums</vaardigheid>
 <vaardigheid soort="Instrument">Gitaar</vaardigheid>
</vaardigheden>

我想循环遍历属性和元素并得到这个结果:

技术

• HTML/CSS
• PHP/MySQL
• Javascript

仪器

• 鼓
• 吉他

有人知道如何实现这一目标吗？只需要基本了解如何使用 jQuery 以这种方式循环访问属性和元素。

Answer 1

DEMO

使用parseXML和每个 - 注意，脚本将在此处的字符串或 ajaxed 文件上运行。

var xml = '<vaardigheden> <vaardigheid soort="techniek">HTML/CSS</vaardigheid> <vaardigheid soort="techniek">PHP/MySQL</vaardigheid><vaardigheid soort="techniek">Javascript</vaardigheid><vaardigheid soort="Instrument">Drums</vaardigheid><vaardigheid soort="Instrument">Gitaar</vaardigheid></vaardigheden>',
xmlDoc = $.parseXML( xml ),
$xml = $( xmlDoc ),
$vaardigheden = $xml.find( "vaardigheid" );
var currentSoort = "", content = $("#content");
$.each($vaardigheden,function(i,item) {
    var soort = $(this).attr('soort');
    if (soort != currentSoort) {
        content.append("<dt>"+soort+"</dt>");
        currentSoort = soort;
    }
    content.append("<dd>"+$(this).text()+"</dd>");
});