- Objective:
- Breadcrumb: DOM - Document - 实例方法
# 概念阐释
## 语义
`getElementByClassName`是一种 JavaScript 方法,可以在HTML文档中获取属性名(`class`)的所有元素。然后赋这个元素一些js代码,获得前端样式修改的效果。
## 语法
```js
//获取所有类名元素
const myClass = document.getElementByClassName('className');
//获取指定的类名元素
const myClass = document.getElementByClassName('className')[index];
//获取多个类名
const myClass = document.getElementByClassName('className1 className2');
```
# 实例
```js
<!DOCTYPE html>
<html>
<head>
<title>getElementsByClassName Example</title>
</head>
<body>
<div class="example">Example 1</div>
<div class="example">Example 2</div>
<div class="example">Example 3</div>
<script>
var examples = document.getElementsByClassName('example');
for (var i = 0; i < examples.length; i++) {
console.log(examples[i].textContent);
}
</script>
</body>
</html>
```
1. js获取类名为`example`的元素
2. 通过循环在控制台中依次打印出元素的内容`textContent`
```js
var parentElement = document.getElementsByClassName('tree-item-inner')[5];
parentElement.style.display = 'none';
```
当一个 html 页面有许多重复的 className 时,可以通过[[JavaScript 数组]]获取。
# 相关内容
# 问题
# 问题答案
# 参考资料