如何使用jquery将<li>元素附加到现有的<ul>?

时间:2019-12-04 03:16:27

标签: jquery xml

我在XML文件中有一个URL列表,我试图遍历每个URL并将它们添加到无序列表中。我下面的代码可以工作,但是当它显示在页面上时,实际上只有一个URL显示为链接。有没有更好的方法可以做到这一点呢?

function getXMLDetails(itemName) {
$.ajax({
    url: 'getDetailsX.xml',
    cache: false,
    dataType: 'xml',
    success: function(xml) {
        $('#description').empty();
        $(xml).find('item').each(function() {
            if($(this).find('name').text() === itemName) {
                var description = '<p>Description: ' + $(this).find('description').text() + '</p>';
                var price = '<p>Price: $' + $(this).find('price').text() + '</p>';
                var list = '<ul>';
                $(this).find('url').each(function() {
                    list += '<li><a href=' + $(this).text() + '>' + $(this).text() + '</a></li>');
                });
                list += '</ul>';
                $('#description').append(description, price, list);
            }
        });
    }
});

}

显示方式:

enter image description here

这就是它应该显示的方式:

enter image description here

1 个答案:

答案 0 :(得分:0)

为每个循环添加到外部。像这样。可能有帮助。

 var list = '<ul>';
        $(xml).find('item').each(function() {
            if($(this).find('name').text() === itemName) {
                var description = '<p>Description: ' + $(this).find('description').text() + '</p>';
                var price = '<p>Price: $' + $(this).find('price').text() + '</p>';

                $(this).find('url').each(function() {
                    list += '<li><a href=' + $(this).text() + '>' + $(this).text() + '</a></li>');
                });

                $('#description').append(description, price, list);
            }
        });
        list += '</ul>';