Question

我正在做一个简单的练习 - 按时间间隔改变div的背景颜色并遇到问题，由于某种原因，JS不会读取对象的风格。下面是HTML，CSS和JS清除，我的意思是：

HTML：

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <link href="style.css" rel="stylesheet" type="text/css" />
</head>
<body>
    <div id="main">
        <div id="header"></div>
        <div id="menu"></div>
        <div class="content"></div>
        <div class="content" id="change"></div>
        <div id="gallery"></div>
        <div class="footer"></div>
    </div>
    <script src="JavaScript.js"></script>
</body>
</html>

CSS：

  #main {
    width:60%;
    margin-left:20%;
    overflow:auto;
}

#header {
    margin-top:0;
    width:100%;
    height:140px;
    background-color:gray;
}

#menu {
    width:100%;
    height:70px;
    background-color:black;
}

.content {
    background-color:whitesmoke;
    width:80%;
    min-height:250px;
    float:left;
}

#gallery {
    margin-top:-5px;
    background-color:lightblue;
    width:100%;
    min-height:60px;
}

#change {
    float:none;
    width:20%;
    display:inline-block;
    background-color:gray;
}

JS：

window.onload; {
var fancy = document.getElementById('change');
var palette = ['gray', 'red', 'green', 'blue', 'white', 'yellow'];
function colorChange(colors) {
    var current = colors.indexOf(fancy.style.backgroundColor);
    fancy.style.backgroundColor = (current < colors.length-1) && colors[++current] || colors[0];
};
setInterval(colorChange(palette), 3000);

}

问题在于

var current = colors.indexOf(fancy.style.backgroundColor);

不起作用。它返回-1，而它应该在调色板数组中返回正确的颜色索引。我究竟做错了什么？似乎一切都写得正确（

JS没有阅读对象的风格

0 个答案: