JavaScript 经典实例：第三版

308

｜

第

12

章

12.4.3

讨论

上述方案演示了一个相当优雅的查询选择符，即通用选择符（

*

）。通用选择符评估

所有元素，如果需要验证各个元素的某一方面，便可以使用该选择符。在上述方案中，

我们想查找具有同一属性的全部元素。

为了测试属性是否存在，只需在一对方括号中列出属性名称（

[attrname]

）。在上

述方案中，我们先测试元素是否有

class

属性。如果有，随元素集合返回。

var

elems = document.querySelectorAll('*[class]');

然后，获取所有

class

属性的值为

red

的元素。如果不确定类名，可以使用子串匹

配查询选择符。

const

reds = document.querySelectorAll('*[class="red"]');

现在，类名中包含子串

red

的元素都符合条件。

你还可以修改句法，查找所有不具有特定值的元素。假如你想查找所有未设定某个

类名的元素，使用否定运算符

:not

。

const

notRed = document.querySelectorAll('div:not(.red)');

12.5

获取所有特定类型的元素

12.5.1

问题

你想获取指定文档中的所有

img

元素。

12.5.2

方案

使用

document.getElementsByTagName()

方法，参数传入

img

。

const

imgElements = document.getElementsByTagName('img');

处理

HTML

｜

309

12.5.3

讨论 ...