這個DIV背景圖像分配有什麼問題？

Question

var bgimages ='myImage.png' 

var pathToImg=new Array(), i=0 
pathToImg[0]=new Image() 
pathToImg[0].src=bgimages 

document.body.background=pathToImg[i].src 

//上述作品 然而，當我試圖將「身體」元素以「滑動」的ID更改爲「DIV」失敗，僅供參考，這個div存在

document.getElementById('slide').style.background-image = pathToImg[i].src 

或者動態設定DIV背景的正確語法是什麼？

謝謝。

• 此外，全碼

// image slideshow script 2 
 
var bgimages=new Array() 
 
bgimages[0]="paper-n.jpg" 
 
bgimages[1]="kn-n.png" 
 
// bgimages[2]="img3.jpg" 
 

 
//preload images 
 
var pathToImg=new Array() 
 
for (i=0;i<bgimages.length;i++){ 
 
    pathToImg[i]=new Image() 
 
    pathToImg[i].src=bgimages[i] 
 
} 
 

 
var inc=-1 
 

 
function bgSlide(){ 
 
    if (inc < bgimages.length-1) 
 
    inc++ 
 
    else 
 
    inc=0 
 
    // document.body.background=pathToImg[inc].src 
 
    document.getElementById('slide').style['background-image'] = pathToImg[inc].src 
 
    // "url('" + pathToImg[i].src + "')"; 
 
} 
 

 
if (document.all||document.getElementById) 
 
    window.onload=new Function('setInterval("bgSlide()",3000)')

// slideshow 
 
body { 
 
    /*Remove below line to make bgimage NOT fixed*/ 
 
    background-attachment:fixed; 
 
    background-repeat: no-repeat; 
 
    /*Use center center in place of 300 200 to center bg image*/ 
 
    background-position: 300 200; 
 
}

<div id="slide"></div>

Answer 1

你忘style：

document.body.style.background=pathToImg[i].src 
       ^^^^^ 

background是CSS主義，不是那是的一部分標籤本身。

Answer 2

更改style使用[]代替.，像這樣：

document.getElementById('slide').style['background-image'] = pathToImg[i].src; 

Answer 3

嘗試使用和backgroundImage而不是背景圖像。

document.getElementById('slide').style.backgroundImage = pathToImg[i].src 

也喜歡在這裏的例子：http://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_style_backgroundimage2

Answer 4

根據這個link的文檔，你應該寫這樣的：

document.getElementById("slide").style["background-image"] = "url('" + pathToImg[i].src + "')"; 

編輯修改 工作代碼

// image slideshow script 2 
 
var bgimages=new Array() 
 
bgimages[0]="http://dummyimage.com/200x123/0f0/00f" 
 
bgimages[1]="http://dummyimage.com/200x123/f00/00f" 
 
// bgimages[2]="img3.jpg" 
 

 
//preload images 
 
var pathToImg=new Array() 
 
for (i=0;i<bgimages.length;i++){ 
 
    pathToImg[i]=new Image() 
 
    pathToImg[i].src=bgimages[i] 
 
} 
 

 
var inc=-1 
 

 
function bgSlide(){ 
 
    
 
    if (inc < bgimages.length-1) 
 
    inc++ 
 
    else 
 
    inc=0 
 

 
    // BOTH of following works 
 
    //document.getElementById('slide').style.backgroundImage = "url("+pathToImg[inc].src+")"; 
 
    document.getElementById('slide').style['background-image'] = "url('"+pathToImg[inc].src+"')"; 
 
} 
 

 
if (document.all||document.getElementById) 
 
    window.onload=new Function('setInterval("bgSlide()",3000)')

// slideshow 
 
body { 
 
    /*Remove below line to make bgimage NOT fixed*/ 
 
    background-attachment:fixed; 
 
    background-repeat: no-repeat; 
 
    /*Use center center in place of 300 200 to center bg image*/ 
 
    background-position: 300 200; 
 
} 
 

 
#slide { 
 
    width : 200px; 
 
    height : 123px; 
 
}

<div id="slide">This is my div</div>