使用jQuery

Question

作为概念验证，我试图使用与原始图像相同的图像来更改div的背景图像。

原来的CSS是：

CSS

.content {
  background-image: url("test.jpg");
}

包装器中的jQuery：

$('.content').css("background-image", 'url(test.jpg)');

我可以看到jQuery正好点火，并替换了图像（并在Firebug中验证了CSS完全相同），但由于某种原因，在jQuery触发后，浏览器“无法加载图像”

计算出的CSS完全相同。如果我取消选择jQuery引入的内联规则，则会激活旧规则并显示图像。

为什么浏览器在内联注入时与在CSS文件中注入规则时会区别对待规则？

Answer 1

你的jQuery中有一个拼写错误：

$('.content').css("background-image", 'url(test.jpg)');

应该是：

$('.content').css("background-image", 'url("test.jpg")');

Answer 2

缺少的引号不是问题。 问题是图片的路径。

如果图片与页面位于同一文件夹中，则可以使用test.jpg。

如果图片位于您网站上的其他文件夹中，则需要包含该图片的相对路径：

$('.content').css("background-image", 'url(../images/test.jpg)');

Answer 3

$('.content').css("background-image", 'url(test.jpg)');

替换为

$('.content').css("background-image", 'url("test.jpg")');

请注意缺少引号。