如何从JavaScript调用CSS

How to call CSS from JavaScript

本文关键字：调用 CSS JavaScript      更新时间：2023-09-26

我想有不同的背景图像为不同的条件(JS,HTML,CSS)。例如:如果(n=1)，则图像1否则if(n=2)，则图像2等

尝试创建一个Css类 ..之后，你可以把它设置为你的控制从javascript..

document.getElementById("MyControl").className = "MyClass";

在css类MyClass中可以设置背景图像。您可以创建另一个css类，使用不同的背景图像并根据条件设置它。

在jQuery中应该很容易。

if(n == 1){
     $('your_image_element').css('background-image','url(your_first_img_path)') ;
}else if(n ==2){
      // second image...
}

一旦选择了要操作的对象，就可以直接从脚本中设置其css属性。例如，body元素的背景图像更改:

var object = document.body;
object.style.backgroundImage="url('new_image.jpg')";

一种方法是使用脚本动态更改CSS规则，例如

var image;
if ( /*some condition */ ) {
  image = 'a.png';
}  else {
  image = 'b.png';
}
document.write('<style type="text/css">.someClass {background-image:url("' + image + '");}<'/style>');

当然还有更复杂的方法来修改规则，以上只是一个基本的方法。

相关文章：