我们可以在CSS“背景”中使用“javascript”代码吗？

Question

  

可能重复：
  Using Javascript in CSS

是否可以在css javascript中使用background个代码？ 意思是这样的：

  

style =“background：url（javascript：--- javascript codes ---）;”   这种语法有用吗？

提前致谢

Answer 1

你无法在CSS中使用JavaScript。但是如果你想使用JavaScript改变背景图像，那么就行了，

document.getElementById("<element ID>").style.backgroundImage = "url(<url of image>)";

Answer 2

使用JavaScript访问样式属性

您无法在 CSS中使用JavaScript ，但您可以使用JavaScript来设置您的CSS规则。例如：

// Create CSS BackgroundImage Rule
var bg = "url('http://placekitten.com/200/300)";

// Apply Rule
document.getElementById("foo").style.backgroundImage = bg;

在CSS中使变量和函数成为可能

此外，还有一系列框架和工具允许您在CSS中使用函数和变量，例如SASS或LESS。

IE的旧版（自2008年以来已死）动态属性

最接近你的CSS 你的CSS将是Dynamic Properties（在IE5中引入），它具有非常差的跨浏览器支持，并且是{{3在现代版本的IE中。

使用jQuery进行快速简单的CSS修改

如果您需要使用JavaScript对样式进行大量修改，大体上人们正在采用框架来协助解决这个问题。例如，一个流行的框架是jQuery，它允许以下内容：

$("#foo").css('background-color', 'red');

以及通过物体进行质量分配：

var color  = "#ffe", 
    border = "5px solid #ccc";

$("#foo").css({ 'background-color': color, 'border-left': border });

Answer 3

技术上是，使用表达式：

background: expression(JS code resulting in a vali background image string here)

但是我认为它只能在IE中运行，这是非常糟糕的做法，因为它可能需要每秒重新评估代码数百次。

相反，你应该有一个合适的默认值，然后在页面上稍后使用JavaScript来改变它。