Web - DOM

1. 简介

DOM（Document Object Mode）是一套web标准，地那一了访问HTML文档的一套属性、方法和事件

其本质：

　　网页 与 脚本语言 沟通的桥梁

　　脚本语言通过DOM对象来访问HTML页面，从而改变文档的结构、样式和内容。

　　当浏览器载入HTML文档时，他就会称谓document对象树。

2. DOM对象

（1）文档对象：整个HTML文档

（2）节点对象：所有的HTML元素都是元素节点

（3）属性对象：依附于元素节点，所有节点的属性都是节点

（4）文本对象：文本插入到HTML元素是文本节点

3. 查找元素

（1）元素的id属性

　　document.getElementsById(元素id值)

　　Id唯一，返回唯一元素

（2）元素的class属性

　　documenr.getElementsByClassName(元素class值)

　　返回值为一个元素列表

（3）元素的标签名

　　document.getElementsByTagName(标签名)

　　返回值为一个元素列表

（4）css选择器

　　查找一个元素：document.querySelector(css 表达式)

　　查找多个元素：document.querySelectorAll(css 表达式)

　　在css选择器中，#表示元素的id  .表示元素的class属性

4. 获取和修改元素属性

（1）获取元素属性

　　document.getElementByXXX("").属性名

　　document.getElementByXXX("")。getAttribute(属性名)

（2）修改元素属性

　　document.getElementByXXX("").属性名 = 属性值

　　document.getElementByXXX("").setAttribute(属性名,属性值)

5. 获取和修改元素的内容

（1）获取元素内容

　　document.getElementByXXX("").innerHTML    包括HTML标签

　　document.getElementByXXX("").innerText　　不包括标签，纯文本

（2）修改元素内容

　　document.getElementByXXX("").innerHTML = new HTML    包括HTML标签

　　document.getElementByXXX("").innerText　= new Text　不包括标签，纯文本

6. 修改样式

　　document.getElementByXXX("").style.样式名=样式值