爲什麼querySelectorAll（）和getElementsByTagName（）不起作用？

Question

我試圖選擇HTML頁面中的所有<a>元素，然後向它們中的每一個添加一個類。然後再運行一個函數，從每個<a>元素中刪除同一個類。

我試着querySelectorAll（）來做到這一點：

document.querySelectorAll('a').className += ' class1'; 

而且隨着的getElementsByTagName（）：

document.getElementsByTagName('a').className += ' class1'; 

但無論是作品。我已經與jQuery合作了，所以不需要那個答案。我只是想在這種情況下比較JavaScript和jQuery的性能，並在我學習時學習更多的vanilla JavaScript。

我也試圖消除類像這樣：

document.querySelectorAll("a").className = 
    document.querySelectorAll("a").className.replace 
    (/(?:^|\s)class1(?!\S)/g , '') 

和：

document.getElementsByTagName("a").className = 
document.getElementsByTagName("a").className.replace 
    (/(?:^|\s)class1(?!\S)/g , ''); 

但無論這些工作要麼。任何幫助將不勝感激。

Answer 1

Document.querySelectorAll返回一個列表。你需要迭代列表元素

Answer 2

document.querySelectorAll返回一個列表，所以你需要遍歷它。例如：

var links = document.querySelectorAll('a'); 
for(var i = 0; i < links.length; i++){ 
    links[i].className = 'class1'; 
}