Question

我正在使用Blogger API制作元素，并在其中添加背景图片，如以下代码所示：

.pimg{height:300px;width:300px}

<div id='content'></div>
<script>
function handleResponse(response) {
  const parser = new DOMParser();
console.log(response);
  response.items.forEach(item => {
    const html = parser.parseFromString(item.content, 'text/html');
    const img = html.querySelector('img');
    const url = img ? img.src : '';
const images =url;
const content =item.content;
var count = 200;
var result = content.slice(0, count) + (content.length > count ? "..." : "");
    document.getElementById("content").innerHTML += `<div class="post-outer">
<h2 class="entry-title">
<a href="${item.url}" id="pt">${item.title}</a>
</h2>
<div class="pimg" style="background-image: url("${images}");">
</div>
<div class="post-inner">
${result}
<a href="${item.url}" id="pt">[Continue Reading]</a>
</div>
<div class="clear"></div>
</div>`;
  })
}
</script>
<script src="https://www.googleapis.com/blogger/v3/blogs/6626813856655473541/posts?maxResults=4&callback=handleResponse&nextPageToken&key=AIzaSyD_BnKD6_7Fygmd6PZc5ReEDek842iMOzo"></script>

这是上面代码中的行，我在其中添加背景图片： <div class="pimg" style="background-image: url("${images}");"> 原始图片网址是这样的：https://4.bp.blogspot.com/-7vVCeLa3OuM/WzjdK1ovHPI/AAAAAAAABwo/mfeTNYcQ294d5kSAPifOP3VQMyrUmWIBwCLcBGAs/s1600/summar-large-card.png

但是当我的内容加载背景图像时，设置为： <div class="pimg" style="background-image: url(" https:="" 4.bp.blogspot.com="" -7vvcela3oum="" wzjdk1ovhpi="" aaaaaaaabwo="" mfetnycq294d5ksapifop3vqmyrumwibwclcbgas="" s1600="" summar-large-card.png");"=""> </div>

Answer 1

尝试使用：

"background-image: url('${images}');"

Answer 2

为什么不使用CSS

List<?>

无法使用javascript

2 个答案: