遍历多个 RSS 源并在不同的 div 中输出？

Question

我想遍历两个（将来可能更多）RSS 提要并将它们放在不同的容器 div 中。我从以下问题开始：JQuery Fetch Multiple RSS feeds。

这是我的代码。

    var thehtml = '';

    $(function () {
    var urls = ['http://www.gosugamers.net/counterstrike/news/rss', 'http://www.hltv.org/news.rss.php'];
    for (var i = 0; i < urls.length; i++) {
        $.ajax({
            type: "GET",
            url: document.location.protocol + '//ajax.googleapis.com/ajax/services/feed/load?v=1.0&num=1000&callback=?&q=' + encodeURIComponent(urls[i]),
            dataType: 'json',
            error: function () {
                alert('Unable to load feed, Incorrect path or invalid feed');
            },
            success: function (xml) {
                values = xml.responseData.feed.entries;
                console.log(values);

                $.each(values, function(idx, value){

                    thehtml += '<a class="news-item" href="' + value.link + '" title="' + value.title +'" target="_blank"><p>' + value.publishedDate + '</p><h3>' + value.title + '</h3></a><hr>';    
                  });

              $("#content_1").html(thehtml);

            }
        });
    }
});

我加载了两个 RSS 提要，在控制台输出中我可以看到两个数据数组。

现在我使用 $(#content_1).html(thehtml); 在容器 div、#content_1.

中将提要数据输出为 HTML

我想要做的是将第一个 RSS 提要放入 #content_1，将第二个放入 #content_2。我尝试使用 .slice(0,10) 但无法正常工作，而且这似乎不是最好的方法。

Answer 1

这里是间隔时间。容器内容将清空以显示新数据。

Update: Ajax results target content_1 and content_2 with optional second method.

$(function () {
function GetFeeds(){
var urls = ['http://www.gosugamers.net/counterstrike/news/rss', 'http://www.hltv.org/news.rss.php'];
urls.forEach(function(Query){
$.ajax({
  type: "GET",
  url: 'http://ajax.googleapis.com/ajax/services/feed/load?v=1.0&num=1000&callback=?&q='+encodeURIComponent(Query),
  dataType: 'json',
  error: function () {
  alert('Unable to load feed, Incorrect path or invalid feed');
  },
  success: function(xml) {
//--Target ID's By content_1/2
var Content=parseInt(urls.indexOf(Query))+1;
   $("#content_"+Content).html('');  
    $.each(xml.responseData.feed.entries, function(idx, value){
    $("#content_"+Content).append('<a class="news-item" href="' + value.link + '" title="' + value.title +'" target="_blank"><p>' + value.publishedDate + '</p><h3>' + value.title + '</h3></a><hr>');    
  });
//---------------
//--Target ID's By Domain (Method Two)
/*
   $("#"+Query.split('.')[1]).html('');  
    $.each(xml.responseData.feed.entries, function(idx, value){
    $("#"+Query.split('.')[1]).append('<a class="news-item" href="' + value.link + '" title="' + value.title +'" target="_blank"><p>' + value.publishedDate + '</p><h3>' + value.title + '</h3></a><hr>');    
  });
-----------------------------------*/
  }
});
});
}
//Call GetFeeds every 5 seconds.
setInterval(GetFeeds,5000);
//Page is ready, get feeds.
GetFeeds();
});

#content_1{float:left;width:40%;overflow:hidden;border:solid 2px blue;}
#content_2{float:right;width:40%;overflow:hidden;border:solid 2px yellow;}
/* Method Two Styles
#gosugamers{float:left;width:40%;overflow:hidden;border:solid 2px green;}
#hltv{float:right;width:40%;overflow:hidden;border:solid 2px red;}
*/

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<div id="content_1"></div>
<div id="content_2"></div>
<!-- Method Two Elements
<div id="gosugamers"></div>
<div id="hltv"></div>
-->

如果您不理解上面的任何源代码，请在下面发表评论，我会添加任何必要的 comments/notes。 答题表示赞赏

希望对您有所帮助。编码愉快！

遍历多个 RSS 源并在不同的 div 中输出？

Loop through multiple RSS sources and outputting in different divs?

html

javascript

rss

jquery

json