按類名更改div的style.width

Question

我一直在試圖用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); 

我就要「未定義不能設置屬性width」。正如我所說，它與ID完美協作，但給我有10個酒吧動畫我寧願使用類名稱，所以它的清潔。

在此先感謝。

Answer 1

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);