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培训课程内容欢迎关注尚硅谷Java培训,尚硅谷除了这些技术文章外还有免费的高质量Java培训课程视频供广大学员下载学习
上一篇: Java培训课程基本语法之其它语法
下一篇: Java培训课程JavaWeb之js事件