认识dom 文档对象模型dom（document object model）定义访问和处理html文档的标准方法。dom 将html文档呈现为带有元素、属性和文本的树结构（节点树）。
先来看看下面代码:
将html代码分解为dom节点层次图:
html文档可以说由节点构成的集合，三种常见的dom节点:
1. 元素节点：上图中、
、等都是元素节点，即标签。
2. 文本节点:向用户展示的内容，如
...中的javascript、dom、css等文本。 3. 属性节点:元素属性，如标签的链接属性href=http://www.imooc.com。
看下面代码:
javascript dom
通过id获取元素 学过html/css样式，都知道，网页由标签将信息组织起来，而标签的id属性值是唯一的，就像是每人有一个身份证号一样，只要通过身份证号就可以找到相对应的人。那么在网页中，我们通过id先找到标签，然后进行操作。
语法:
document.getelementbyid(“id”)
看看下面代码:
结果:null或[object htmlparagraphelement]
注:获取的元素是一个对象，如想对元素进行操作，我们要通过它的属性或方法。
innerhtml 属性 innerhtml 属性用于获取或替换 html 元素的内容。
语法:
object.innerhtml
注意:
1.object是获取的元素对象，如通过document.getelementbyid(id)获取的元素。
2.注意书写，innerhtml区分大小写。
我们通过id=con获取 元素，并将元素的内容输出和改变元素内容，代码如下:
结果:
改变 html 样式 html dom 允许 javascript 改变 html 元素的样式。如何改变 html 元素的样式呢？
语法:
object.style.property=new style;
注意:object是获取的元素对象，如通过document.getelementbyid(id)获取的元素。
基本属性表（property）:
注意:该表只是一小部分css样式属性，其它样式也可以通过该方法设置和修改。
看看下面的代码:
改变 元素的样式，将颜色改为红色，字号改为20,背景颜色改为蓝：
hello world!

结果:
显示和隐藏（display属性） 网页中经常会看到显示和隐藏的效果，可通过display属性来设置。
语法：
object.style.display = value
注意:object是获取的元素对象，如通过document.getelementbyid(id)获取的元素。
value取值:
看看下面代码:
控制类名（classname 属性） classname 属性设置或返回元素的class 属性。
语法：
object.classname = classname
作用:
1.获取元素的class 属性
为网页内的某个元素指定一个css样式来更改该元素的外观 看看下面代码，获得 元素的 class 属性和改变classname：
结果:
我的公众号二维码