使用getElementsByClassName时类名含空格是否可行？及解决方法咨询

为什么你的代码无法运行？ #

你遇到的问题其实有两个核心原因：

1. 类名的误解：HTML元素的class属性里的空格不是类名的一部分，而是用来分隔多个独立类名的标记。所以_2nlw _2nlv实际上表示这个元素同时拥有_2nlw和_2nlv两个类，而非一个带空格的完整类名。
2. 方法返回值的特性：document.getElementsByClassName()返回的是一个HTMLCollection（类数组对象），不是单个DOM元素。你直接在这个集合上调用.innerHTML，自然会得到undefined——因为集合本身没有这个属性。

解决方案 #

这里提供两种可靠的解决方式，按需选择：

方式1：修正getElementsByClassName的使用逻辑

既然该方法返回的是类数组，你需要通过索引获取具体元素（比如第一个匹配项），再访问它的innerHTML：

// 获取所有同时拥有_2nlw和_2nlv类的元素集合
var elements = document.getElementsByClassName('_2nlw _2nlv');
// 安全获取第一个元素的innerHTML（避免集合为空时报错）
var example = elements.length > 0 ? elements[0].innerHTML : '';

方式2：用querySelector实现更简洁的写法

如果你只需要获取第一个匹配的元素，querySelector会更顺手——它支持标准CSS选择器语法，多个类名用.连接（无空格）就表示同时拥有这些类：

var element = document.querySelector('._2nlw._2nlv');
// 先判断元素是否存在，再获取innerHTML
var example = element ? element.innerHTML : '';

小提示：如果直接写document.querySelector('._2nlw._2nlv').innerHTML，当没有匹配到元素时会抛出错误，所以加上存在性判断更稳妥。

内容的提问来源于stack exchange，提问作者Anders Andersson