更多"Try it Yourself"下面的例子。
定义和用法
的getElementsByClassName()方法返回与指定的类名的文档中的所有元素的集合,作为一个节点列表对象。
该节点列表对象表示节点的集合。 节点可以通过索引号来访问。 该指数从0开始。
提示:您可以使用长度的NodeList对象的属性来确定与指定的类名元素的数量,那么你可以通过所有元素循环和提取所需的信息。
浏览器支持
在表中的数字规定,完全支持方法的第一个浏览器版本。
方法 | |||||
---|---|---|---|---|---|
getElementsByClassName() | 4 | 9 | 3.0 | 3.1 | 9.5 |
句法
document.getElementsByClassName( classname )
参数值
参数 | 类型 | 描述 |
---|---|---|
classname | String | 需要。 你想获得的元素的类名。 要搜索多个类名,他们用空格隔开,像"test demo" 。 |
技术细节
DOM版本: | 核心1级文档对象 |
---|---|
返回值: | 甲NodeList对象,表示与指定的类名的元素的集合。 当它们出现在源代码中返回的集合中的元素进行排序。 |
更多示例
例
找出带有class =“示例”多少个元素有在文档中(使用NodeList对象的长度属性):
var x =
document.getElementsByClassName("example").length;
试一试» 例
改变与类=“示例”的所有元素的背景色:
var x = document.getElementsByClassName("example");
var i;
for (i = 0;
i < x.length; i++) {
x[i].style.backgroundColor =
"red";
}
试一试» 相关页面
CSS教程: CSS选择器
CSS参考: CSS选择器的.class
HTML DOM参考: 元素 。 getElementsByClassName()
HTML DOM参考: className Property
HTML DOM参考: classList Property
HTML DOM参考: Style对象