87,997
社区成员
发帖
与我相关
我的任务
分享求助：关于Javascript改变div背景色
初学使用js给div改变背景色，但我这样写没有作用，请大家帮忙看看。
<body>
<input id="bt1" type="button" value="变色" />
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<script>
var oDt = document.getElementById('bt1');
var oDiv = document.getElementsByTagName('div')
var i = 0;
function changeColor() {
if (i++%2 == 0) {
oDiv.style.backgroundColor = 'rad';
} else {
oDiv.style.backgroundColor = 'green';
}
oDt.onclick=function changeColor();
}
</script>
</body>
<body>
<input id="bt1" type="button" value="变色" />
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<script>
var oDt = document.getElementById('bt1');
var oDiv = document.getElementsByTagName('div')
var i = 0;
function changeColor() {
if (i++%2 == 0) {
oDiv.style.backgroundColor = 'rad';
} else {
oDiv.style.backgroundColor = 'green';
}
oDt.onclick=function changeColor();
}
</script>
</body>
...全文
请发表友善的回复…
发表回复
前端_小菜鸟 2019-09-11
- 打赏
- 举报
因为你找到的oDiv是一个数组,要进行循环后对每一个进行修改样式操作才可以
jio可 2019-09-11
- 打赏
- 举报
<input id="bt1" type="button" value="变色" />
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<script>
var oDt = document.getElementById('bt1');
var oDiv = document.getElementsByTagName('div')
oDt.onclick = function changeColor() {
for (var i = 0; i<oDiv.length; i++) {
oDiv[i].innerHTML = i
if (i % 2 == 0) {
oDiv[i].style.backgroundColor = 'red';
} else {
oDiv[i].style.backgroundColor = 'green';
}
}
}
</script>
oDiv是伪数组需要循环，然后获取指定的(oDiv[i]) div改变背景。直接oDiv肯定是错误的
众生皆苦唯有我甜 2019-09-11
- 打赏
- 举报
首先你要清楚你获取到的元素是多个还是单个，多个的话需要通过遍历循环去逐一改变属性。
