Question

我正在创建一个按钮，该按钮应突出显示指定类中的某些单词，但是在返回类中的所有元素时遇到了问题。它仅在指定索引的情况下有效，因此我假设现有的“ for循环”可能存在问题。任何帮助表示赞赏！

这将起作用，但是当然只有“突出显示”类中的第一个元素：

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

您可以看到getElementsByClassName是复数的（元素）。实际上，可以将同一类分配给多个HTML元素。您将找不到遗漏[0]的任何方式，也不应如此，因为这可能意味着您从错误的节点获取数据。如果您需要来自特定元素的数据（可以确保它是唯一的），则需要为其指定一个ID，并改用getElementById。

Answer 2

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

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

Answer 3

在返回 htmlcollection

的内容中，您无法访问innerHTML

document.getElementsByClassName('test').innerHTML

因为它是用纯英文写成的：getElementsByClassName。复数。

"Elements"。

结尾处带有"s" ...

表示这是一个数组（htmlcollection）

getElementsByClassName不会返回所有元素

3 个答案: