DOM那些事
DOM: 文档对象模型（Document Object Model，简称 DOM），是 W3C 组织推荐的处理可扩展标记语言（HTML或者XML）的标准编程接口。
1.获取元素
（1）根据id获取
document.getElementById('id');返回获取的元素对象。
可以使用 condole.dir() 打印元素对象
（2）根据标签名获取
document.getElementsByTagName('标签名') 返回获取的对象的集合。
（3）通过HTML5新增方法获取
-
document.getElementsByClassName('类名');返回对象集合 -
document.querySelector('选择器');返回指定选择器的第一个元素对象 -
document.querySelectorAll('选择器')返回指定选择器所有元素对象的集合 - 注意：2，3两种方法里的选择器要加符号，
document.querySelector('#nav');
（4）特殊元素获取
-
获取body元素
document.body -
获取html元素
document.documentElement
2.事件
（1）事件三要素
事件可以理解为一种触发——响应机制
-
事件源
-
事件类型
如：鼠标点击，鼠标经过，键盘输入，点击按钮等
常见的鼠标事件：
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-dwWDvV6E-1634036040660)(DOM那些事/mouse.jpg)]
-
事件处理程序
（2）执行事件的步骤
-
获取事件源
例：
btn = document.querySelector('button'); -
注册事件（绑定事件）
例：
btn.onclick -
添加事件处理程序
例：
btn.onclick = function(){}
3.操作元素
（1）改变元素内容
-
element.innerText获取的内容去除html标签，空格和换行。
-
element.innerHTML获取的内容保留html标签，空格和换行
例：
li.innerHTML = text.value + "<a href=''>删除</a>"; -
注意：以上两种方法均是