DOM介绍

DOM

document object model  

文档对象类型

是 W3C 组织土家 的处理可扩展标记语言(html 或 xml)的标准编程接口

改变网页的内容、结构、样式

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

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

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

DOM 把以上内容都看做是对象

创建

document.write 代码走完会使页面重构

innerHTML

createElemnet

增

appendChild

insertBefore

删

removeChild

改

1、修改元素属性 src href title 等

2、修改普通元素内容 innerHTML innerText

3、修改表单元素 value type disabled 等

4、修改元素样式 style className

查

1、DOM 提供的 API 方法 ：getElementById,getElementsByTagName 不推荐

2、H5 提供的新方法 querySelector querySelectorAll 提倡

3、利用节点操作获取元素：父(parentNode),子(children),兄(previousElementSibling,nextElementSibling) 提倡

属性操作

主要针对自定义属性

1、setAttribute:设置 dom 的属性值

2、getAttribute：得到 dom 的属性值

3、removeAttribute ：移除属性

事件操作

onclick 鼠标点击左键触发

onmouseover 鼠标经过触发

onmouseout 鼠标离开触发

onfocus 获得鼠标焦点触发

onblur 失去鼠标焦点触发

onmousemove 鼠标移动触发

onmouseup 鼠标弹起触发

onmousedown 鼠标按下触发