使用jQuery解析XML时仅返回第一个节点

时间:2014-01-15 14:39:53

标签: jquery xml

我希望我的jQuery脚本只返回它找到的顶级节点,而不是遍历所有节点。我在jQuery脚本中做了哪些更改才能实现这一目标?我知道这与each(function) {}有关,但我不确切知道应该改变什么。提前谢谢!

jQuery代码:

$.ajax({
url: 'xml/timeline.xml',
dataType: 'xml',
success: function(data) {
    $(data).find('channel item').each(function() {
        var fbFeedWrapper = $('<div/>').addClass('fb-feed-wrapper');
        var fbFeedItem = $('<div />').addClass('fb-feed-item');
        $('.socialmedia-list#simlearn').append(fbFeedWrapper);
        fbFeedWrapper.append(fbFeedItem);

        var url = $(this).find('link').text();
        var title = $(this).find('title').text();           
        fbFeedItem.append($('<h1/>').html("<a href='" + url + "'>" + title + "</a>"));                
        var fbItemIcon = $('<div />').addClass('fb-item-icon');
        fbFeedItem.append(fbItemIcon);
        var description = $(this).find('description').text();
                        if (description.length > 80) {
                            description = description.substr(0, 80) + "...";
                        }
        fbFeedItem.append($('<div/>').addClass('fb-item-details').html(description));                            

    })
}


});

XML文件格式:

<channel>
<item> // <-- If i Only want the top <item> node returned what should i do?
    <title></title>
    <link></link>
    <description></description>
</item>
<item>
    <title></title>
    <link></link>
    <description></description>
</item>
<item>
    <title></title>
    <link></link>
    <description></description>
</item>

2 个答案:

答案 0 :(得分:1)

而不是使用.each();只需找到第一个匹配的元素。使用此对象分配变量,然后将this内的.each()引用更改为变量的名称。

示例(在示例中,我将变量命名为self):

更改行:

$(data).find('channel item').each(function() {

是:

var self = $(data).find('channel item').first();

然后将this的所有匹配项更改为self。同时删除.each函数(})

的结束括号和括号
$.ajax({
    url: 'xml/timeline.xml',
    dataType: 'xml',
    success: function (data) {
        var self = $(data).find('channel item').first();
        var fbFeedWrapper = $('<div/>').addClass('fb-feed-wrapper');
        var fbFeedItem = $('<div />').addClass('fb-feed-item');
        $('.socialmedia-list#simlearn').append(fbFeedWrapper);
        fbFeedWrapper.append(fbFeedItem);

        var url = $(self).find('link').text();
        var title = $(self).find('title').text();
        fbFeedItem.append($('<h1/>').html("<a href='" + url + "'>" + title + "</a>"));
        var fbItemIcon = $('<div />').addClass('fb-item-icon');
        fbFeedItem.append(fbItemIcon);
        var description = $(self).find('description').text();
        if (description.length > 80) {
            description = description.substr(0, 80) + "...";
        }
        fbFeedItem.append($('<div/>').addClass('fb-item-details').html(description));
    }
});

答案 1 :(得分:0)

试试这个:

$(data).find('channel item[0]')
    //--------------------^^^-----add [0] to this

:first

$(data).find('channel item:first')

:eq()

$(data).find('channel item:eq(0)')

即使你可以试试这个:

$(data).find('item:eq(0)')