我一直在尝试使用set.interval动画更改div的宽度。它与getELementByID完美配合,但它不适用于getElementsByClassName。
代码如下:
var loadingBar = 200;
function animationBarOne(){
document.getElementsByClassName("loading-bar").style.width=(loadingBar+"px");
loadingBar++;
if(loadingBar === 900){
clearInterval(intervalId);
}
}
var intervalId = setInterval(animationBarOne,1);
我得到“无法设置未定义的属性宽度”。正如我所说,它与ID完美配合,但是给我设置了10个动画条,我更喜欢使用类名来使它更干净。
提前致谢。
答案 0 :(得分:3)
document.getElementsByClassName()
返回一个元素数组。您需要遍历数组以修改列表中的每一个:
var loadingBar = 200;
function animationBarOne(){
var elements = document.getElementsByClassName("loading-bar");
for (var i = 0; i < elements.length; i++) {
elements[i].style.width=(loadingBar+"px");
}
loadingBar++;
if(loadingBar === 900){
clearInterval(intervalId);
}
}
var intervalId = setInterval(animationBarOne,1);