使用 JavaScript 更改 span 类的内容 [关闭]答案

【问题标题】：Change content of span class with JavaScript [closed]使用 JavaScript 更改 span 类的内容 [关闭]
【发布时间】：2016-03-29 08:49:14
【问题描述】：

我需要使用 JavaScript 更改具有类名的 span 的内容。我更喜欢 JavaScript 而不是 jQuery，因为这是一个基本站点并且不加载 jQuery 文件，而且我宁愿不为这件事添加文件。这是我尝试过的：

HTML：

blah blah blah <span class="new"></span> blah blah blah

外部 JavaScript 文件中的 JavaScript：

document.getElementsByClassName('.new')[0].innerHTML = 'new text here';

希望它显示为： blah blah blah new text here blah blah blah

进行了搜索，但只找到了 ElementID 解决方案。

【问题讨论】：

【解决方案1】：

你快到了，只需从class name 中删除.。原因是，当您调用getElementsByClassName 方法时。它仅在整个文档中搜索类名。因此您无需在类名之前放置.。

document.getElementsByClassName('new')[0].innerHTML = 'new text here';

【讨论】：

【解决方案2】：

在同一主机上的不同站点上尝试了该代码，但仍然无法正常工作。我根据在其主机中的类似站点上找到的 elementID 代码修改了代码，这很有效：

var newText = document.getElementsByClassName('new')[0];
newText.innerHTML = 'new text here';

不知道为什么，但这有效。感谢您的回复！

【讨论】：

【解决方案3】：

不要在新的前面加上句号。

document.getElementsByClassName('new')[0].innerHTML = 'new text here';

【讨论】：

【解决方案4】：

从'.new' 中删除点.。这是隐含的，因为该函数只查找类。

更新：根据this question，是的，将您的JavaScript 代码放在底部仍然不足以保证DOM 完全加载。你必须在document.onload之后进行替换。

document.onload = function() {
    document.getElementsByClassName('.new')[0].innerHTML = 'new text here';
}

【讨论】：

【解决方案5】：

如前所述，从选择器中删除点 ('.')。如果您想以这种方式选择类，我建议您使用 document.querySelector 或 document.querySelectorAll :)

【讨论】：