引言：dom(document object model) bom(browser object model)
bom包括dom一下是结构图：
DOM：
节点：
在 HTML DOM 中，所有事物都是节点；整个文档是一个文档节点，每个 HTML 元素是元素节点，HTML 元素内的文本是文本节点，每个 HTML 属性是属性节点，注释是注释节点。
节点的关系：
父（parent）、子（child）和同胞（sibling）等术语用于描述这些关系。
例子：
head和body的父节点是html节点
文本节点 "Hello world!" 的父节点是p节点
head和body是同胞节点
关系图为：
DOM操作：
<p id="intro">Hello World!</p>
var x=document.getElementById("intro");
document.write(x.innerHTML+"haha");
DOM节点的属性：（注：不是属性节点）
innerHTML：获取元素内容的最简单方法是使用 innerHTML 属性。
x.innerHTML="new hehe"
nodeName : 属性规定节点的名称,nodeName 是只读的
console.log(x.nodeName) //p
元素节点的 nodeName 与标签名相同
属性节点的 nodeName 与属性名相同
文本节点的 nodeName 始终是 #text
文档节点的 nodeName 始终是 #document
nodeValue: 规定节点的值
元素节点的 nodeValue 是 undefined 或 null
文本节点的 nodeValue 是文本本身
属性节点的 nodeValue 是属性值
nodeType: 返回节点的类型
parentNode - 节点（元素）的父节点
childNodes - 节点（元素）的子节点
attributes - 节点（元素）的属性节点
dom操作的小例子：
var x=document.getElementById("intro");
var body = document.getElementsByTagName("body")[0]; //body是x的父节点，如要删除x必须先找到其父节点
x.onclick =function(){
body.removeChild(x)
//或者直接 x.parentNode.removeChild(x)
} //点击x则删除x节点
DOM事件：HTML DOM 使 JavaScript 有能力对 HTML 事件做出反应。
HTML 事件的例子：
当用户点击鼠标时
当网页已加载时
当图像已加载时
当鼠标移动到元素上时
当输入字段被改变时
当提交 HTML 表单时
当用户触发按键时
事件的两种形式：
例子：
<h1 onclick="this.innerHTML='谢谢!'">请点击该文本</h1>
例子：
document.getElementById("myBtn").onclick=function(){displayDate()};
onload 和 onunload 事件：
onload 和 onunload 事件会在用户进入或离开页面时被触发。
onmouseover 和 onmouseout 事件
onmouseover 和 onmouseout 事件可用于在用户的鼠标移至 HTML 元素上方或移出元素时触发函数。
