多个图像（xml->javascript->CSS）被覆盖，仅显示一个图像

我正在构建一个简单的抓取应用程序，它从XML中提取数据，格式如下：

<entry>
  <title>Title of something</title>
  <summary>https://link_to_image_used_in_background</summary>
  <link>www.link-to-website.com</link>
</entry>

---

。。。。我的问题是，虽然标题和链接被正确地写入各自的空间，但每个空间的背景图像都会被最后一个xml条目的“摘要”子项覆盖。我为可能糟糕的编码和格式表示歉意——我最初拿了Tobias Totz的rss阅读器/馈线，并试图将其连接起来。谢谢你的帮助

这里的问题是，在循环的每次迭代中，您都要将背景图像设置为具有RSScard类的所有元素。这就是为什么您只能看到最后一个项目图像，因为您已经覆盖了以前的项目图像

要为每个enty设置不同的图像，需要执行以下操作：

for(var entry in entries){
  var $listElement = $("<li class=\"RSScard\".... </li>");

  container.append($listElement);

  $listElement.css({
      backgroundImage: "url('" + entry.summary + "')"
  });   
}

---

在您的XML中，我看不到与背景相关的信息，不确定您想要实现什么？卡片背景应该根据什么信息设置？谢谢您的帮助。。我明白了问题所在，尤其是现在你已经把我推向了正确的方向。但就我的一生而言，我无法让它发挥作用。Idk，如果它的语法问题或逻辑错误，但我要么得到重复的图像或没有背景图像的未定义块，实际上我认为我现在已经解决了主要问题。图像将显示，但仅在预加载时显示。。又是一个障碍！

body {
  background: #444;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;

    font-family: 'Roboto', sans-serif;
    margin:0;
    padding:0;
}

ul {
    list-style-type: none;
}

#Newsfeed {
  max-width: 1350px;
  margin: 0 auto;
  padding-top: 25px;
  padding-bottom: 65px;
}

.RSScard {
    padding: 20px 25px;

    margin-left: 20px;
    margin-top: 20px;

    min-width: 200px;
    max-width: 200px;
    min-height: 225px;

    opacity: .87;
    background-image: var(plink);;

  color: #388E3C;
  font-size: 0.85em;
    text-align: center;
    overflow: hidden;
    box-shadow: 0 0 8px rgba(0,0,0, 0.25);
    float:left;

    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.RSScard a {
    text-decoration: none;
    color: #ededed;
  font-size: 0.75em;
    font-weight: 300;
    opacity: 1;
}

.RSScard:hover {
    opacity: 1;
    background-color: #202B33;
}

for(var entry in entries){
  var $listElement = $("<li class=\"RSScard\".... </li>");

  container.append($listElement);

  $listElement.css({
      backgroundImage: "url('" + entry.summary + "')"
  });   
}