JavaScript 中的背景图像样式属性

Question

我正在尝试在 JavaScript 中引用的 div 上使用样式标签应用背景图像。我确定这与图像变量周围的引号有关。任何帮助将不胜感激。

function appendData () {
 var image = "http://domain.com/image.jpg";
 var html = '<div class="itemImage" style="background-image:url(' + image +    ');"></div>';
 $('.container').append(html);
}

Answer 1

function appendData () {
 var image = "http://domain.com/image.jpg";
 var html = '<div class="itemImage" style="background-image:url(\'' + image +    '\');"></div>';
 $('.container').append(html);
}

Answer 2

我会考虑稍微改变一下你的方法。当然，您可以将 html 附加到您的容器，或者您可以更改 itemImage 的属性而无需每次都重写它。

如果您将 itemImage div 构建到该容器中，您可以改为这样做

function appendData () {
  var image = "http://domain.com/image.jpg";
  $(".itemImage").css("background-image", image);
}

JavaScript 中的背景图像样式属性

Background-image style attribute in JavaScript

javascript

jquery

styles

background-image