@[TOC]
前言
DOM操作有太多了，我们可以查阅文档链接:
JavaScript 和 HTML DOM 参考手册
这里我只选择了三个作为举例
# 1.更改文字
将标签内的文字全部更改为同一段文字
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>DOM</title>
</head>
<body>
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
<div>5</div>
<div>6</div>
<script>
//1，获取所有的 div 元素对象
var divs = document.getElementsByTagName("div");
//2，遍历数组，获取到每一个 div 元素对象，并修改元素内容
for (let i = 0; i < divs.length; i++) {
divs[i].innerHTML = "oh my god";
}
</script>
</body>
</html>
可以看到div里的文字都被更改了
2.更改状态、
将复选框的默认状态由未选中改为选中
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>DOM</title>
</head>
<body>
<input type="checkbox" name="hobby"> 篮球
<input type="checkbox" name="hobby"> 跑步
<input type="checkbox" name="hobby"> 本草纲目毽子操
<script>
//1，获取所有的 复选框 元素对象
var hobbys = document.getElementsByName("hobby");
//2，遍历数组，通过将 复选框 元素对象的 checked 属性值设置为 true 来改变复选框的选中状态
for (let i = 0; i < hobbys.length; i++) {
hobbys[i].checked = true;
}
</script>
</body>
</html>
小结
HTML 中的 Element 元素对象有很多，因为篇幅不能全部举例说明，请大家尽量多看文档，跟着敲，熟能生巧。
