1什么是DOM：
Document Object Modal(文档对象模型)，我们浏览器把整个网页会当成一个大的对象，利用面向对象的方式操作网页内容。
2 DOM模型：
3 document对象
document对象时window对象的一个属性，代表当前整个HTML文档，将这个文档抽象成了document对象，包含了整个dom树的所有内容。
其本质是window.document，而window.可以省略。直接使用document
4 DOM查询
元素查询
|
功能 |
API |
返回值 |
|
●在整个文档范围内查询元素节点 |
||
|
根据id值查询 |
document.getElementById(“id值”) |
一个具体的元素节点 |
|
根据标签名查询 |
document.getElementsByTagName(“标签名”) |
元素节点数组 |
|
根据name属性值查询 |
document.getElementsByName(“name值”) |
元素节点数组 |
|
|
||
|
●在具体元素节点范围内查找子节点 |
||
|
查找全部子节点 |
element.childNodes【W3C考虑换行，IE≤9不考虑】 |
节点数组 |
|
查找第一个子节点 |
element.firstChild【W3C考虑换行，IE≤9不考虑】 |
节点对象 |
|
查找最后一个子节点 |
element.lastChild【W3C考虑换行，IE≤9不考虑】 |
节点对象 |
|
查找指定标签名的子节点 |
element.getElementsByTagName(“标签名”) |
元素节点数组 |
|
|
||
|
●查找指定元素节点的父节点：element.parentNode |
||
|
|
||
|
●查找指定元素节点的兄弟节点 |
||
|
查找前一个兄弟节点 |
node.previousSibling【W3C考虑换行，IE≤9不考虑】 |
节点对象 |
|
查找后一个兄弟节点 |
node.nextSibling【W3C考虑换行，IE≤9不考虑】 |
节点对象 |
5属性操作
1）读取属性值
元素对象.属性名
2）修改属性值
元素对象.属性名=新的属性值
6文本操作
1）读取文本值：element.firstChild.nodeValue
2）修改文本值：element.firstChild.nodeValue=新文本值
上一篇: Java培训之Javaweb课程js事件
下一篇: Java培训之Javaweb课程Jquery
