在“js”中怎么设置div的背景图片?

JavaScript011

在“js”中怎么设置div的背景图片?,第1张

有两种比较直接的方式,

第一种方法:预先设置一个样式,然后在js中操作,给div加上这个class。

html代码:

-----

<div id="test"></div>

-----

预先设置一个样式:

-----

.bg {

background-image: url(xxx.jpg)

}

-----

然后js获取这个div,给div加上名为bg的class

-----

var div = document.getElementById('test')

div.className += ' bg'

-----

第二种方法,直接设置div的style属性:

-----

var div = document.getElementById('test')

div.style.backgroundImage = 'url(xxx.xxx)'

-----

background是全局的背景设置,例如

body {

    background: #fff url('xxx.png') no-repeat

}

拆分出来就是

body {

    background-color: #fff

    background-image: url('xxx.png')

    background-repeat: no-repeat

}

你设置了obj.style.background就覆盖了background-image,所以你要改成这样

obj.style.backgroundImage = 'url("xxx.png")'