getElementsByClassName 没有返回所有元素

Question

我正在创建一个按钮，我应该突出显示指定 class 中的某些单词，但我在返回 class 中的所有元素时遇到问题。它只有在我指定一个索引时才会起作用，所以我假设现有的 "for loop" 可能有问题。感谢您的帮助！

这会起作用，但只有 "highlights" class 中的第一个元素，当然：

var bodyText = document.getElementsByClassName('test')[0].innerHTML;
for (var i = 0; i < searchArray.length; i++) {
bodyText = doHighlight(bodyText, searchArray[i], highlightStartTag, 
highlightEndTag);}

document.getElementsByClassName('test')[0].innerHTML = bodyText;  
return true;

这根本行不通：

var bodyText = document.getElementsByClassName('test').innerHTML;
for (var i = 0; i < searchArray.length; i++) {
bodyText = doHighlight(bodyText, searchArray[i], highlightStartTag, 
highlightEndTag);}

document.getElementsByClassName('test').innerHTML = bodyText;  
return true;

Answer 1

您无法在 returns 和 html 集合

中访问 innerHTML

document.getElementsByClassName('test').innerHTML

因为它是用简单的英语写的：getElementsByClassName。复数.

"Elements"。

最后有一个 "s"...

意味着它是一个（某种）数组（htmlcollection）

Answer 2

如您所见，getElementsByClassName 是复数形式（元素）。事实上，同一个 class 可以分配给多个 HTML 元素。你不会找到任何方法来省略 [0] 并且你不应该这样做，因为这可能意味着你从错误的节点获取数据。如果您需要来自您可以确保唯一的特定元素的数据，那么您需要给它一个 ID 并改用 getElementById。

Answer 3

如果要替换多个元素中的多个单词，需要两个循环：

const testElements = document.getElementsByClassName('test');
for (const element of testElements) {
    for (const search of searchArray) {
        element.innerHTML = doHighlight(element.innerHTML, search, highlightStartTag, highlightEndTag);
    }
}

getElementsByClassName 没有返回所有元素

getElementsByClassName isn't returning all elements

javascript

getelementsbyclassname