Blogger自定义JavaScript文章展示函数仅显示单篇文章的问题求助

Hey，我一眼就看到问题所在啦！你的代码之所以只能显示一篇文章，核心原因是文章的HTML生成和输出逻辑都写在for循环外面了，循环跑完之后只有最后一篇文章的变量值被保留下来，自然就只能输出这一篇。另外还有个小拼写错误，咱们一起修正：

具体问题点 #

• 你在for (var i = 0; i < entries.length; ++i)循环里只做了变量赋值（比如获取标题、缩略图、链接），但生成图片标签和输出的代码都在循环外面，所以循环结束后只会处理最后一次循环的变量值
• 生成图片标签时，你错误地用了links数组而不是拿到的postUrl变量，这会导致链接失效

修正后的完整代码 #

<script> //<![CDATA[
function homePageRecentPost (root) {
  var entries = root.feed.entry || [];
  for ( var i = 0; i < entries.length; ++i) {
    var posts = entries[i];
    var postTitle = posts.title.$t;
    var originalThumbnailUrl = posts.media$thumbnail ? posts.media$thumbnail.url : 'http://3.bp.blogspot.com/-sWtp_qRPNT8/UZYmQq5sAdI/AAAAAAAAEec/7YDbpK4Q6g8/s72-c/default+image.png';
    var newThumbnailUrl = originalThumbnailUrl.replace('/s72-c','');
    var links = posts.link || [];
    var postUrl = '';
    // 找到文章的alternate链接
    for ( var j = 0; j < links.length; ++j) {
      if (links[j].rel == 'alternate') {
        postUrl = links[j].href;
        break;
      }
    }
    // 把生成和输出的逻辑放到循环内部，每篇文章都会执行
    var imgTag = '<a href="' + postUrl + '">' +'<img src="' + newThumbnailUrl+ '" alt="' + postTitle + '">' + '</a>';
    document.write(imgTag);
  }
}
//]]> </script>

修正说明 #

1. 优化了postUrl的赋值逻辑，直接在内部循环里完成赋值，避免外部引用可能出现的未定义问题
2. 将生成图片标签和document.write的代码移到了外层for循环内部，这样每遍历一篇文章就会输出对应的内容
3. 修正了图片链接里的变量错误，用postUrl替代了错误的links

这样修改后，你的函数就能正常显示所有指定数量（这里是8篇）的最新文章啦！

内容的提问来源于stack exchange，提问作者ZUPPA LOL