DOM文档对象模型（一）

一.概论

1.什么是dom

文档对象模型,W3C组织推荐的的处理可扩展标记语言的标准编程接口
DOM 是一项 W3C (World Wide Web Consortium) 标准。
DOM 定义了访问文档的标准：
“W3C 文档对象模型（DOM）是中立于平台和语言的接口，它允许程序和脚本动态地访问、更新文档的内容、结构和样式。”

文档：一个页面就是一个文档，DOM中使用document表示


元素：页面里所有的标签都是元素，DOM中使用element


节点：网页中所有的内容都是一个节点(标签，属性，文本，注释等),DOM中使用的node表示

文档页面从上往下加载,所以先有标签，js写在标签下面

2.dom能做什么

通过这个对象模型，JavaScript 获得创建动态 HTML 的所有力量：
1.JavaScript 能改变页面中的所有 HTML 元素
3.JavaScript 能改变页面中的所有 HTML 属性
3.JavaScript 能改变页面中的所有 CSS 样式
4.JavaScript 能删除已有的 HTML 元素和属性
5.JavaScript 能添加新的 HTML 元素和属性
6.JavaScript 能对页面中所有已有的 HTML 事件作出反应
7.JavaScript 能在页面中创建新的 HTML 事件

3.dom树

HTML DOM 模型被结构化为对象树：

DOM可以把以上内容都看做对象。即文档是一个对象，根元素也是对象，元素也是对象，属性也是对象，文本也是对象

---

二.获取元素

1.根据ID获取

getElementById()方法，获取带有ID的元素对象

参数id是大小写敏感字符串
返回的是元素对象

    <div id="time">2019-9-9</div>
    <script>
        var timer = document.getElementById('time');
        console.log(timer);
        console.log(typeof timer); // 返回的是对象
        console.dir(timer)