JavaScript组成
| JavaScript组成 |
作用 |
兼容性 |
| ECMAScript:解释器、翻译 |
|
几乎没有兼容性问题 |
| DOM:Document Object Model，文档对象模型 |
操作页面元素的能力document |
有一些兼容性问题 |
| BOM:Browser Object Model，浏览器对象模型 |
操作浏览器的能力window |
没有兼容性问题---几乎不兼容 |
DOM基础操作---获取节点、节点操作、属性操作、文本操作
在 HTML DOM 中，所有事物都是节点。DOM 是被视为节点树的 HTML。
1、获取节点---document、节点指针
| document |
语法 |
功能 |
| getElementById |
document.getElementById(“id”) |
通过元素id获取节点 |
| getElementsByName |
document.getElementsByName(元素name属性) |
通过元素的name属性获取节点 |
| getElementsByTagName |
document.getElementsByTagName(元素标签) |
通过元素标签获取节点 |
| 节点指针 |
语法 |
功能 |
| firstChild firstElementChild |
父节点.firstChild |
获取元素的首个子节点 |
| lastChild lastElementChild |
父节点.lastChild |
获取元素的最后一个子节点 |
| childNodes |
父节点.childNodes |
获取元素的子节点列表 |
| previouSibling previousElementSibling
|
兄弟节点.previouSibling |
获取已知节点的前一个节点 |
| nextSibling nextElementSibling |
兄弟节点.nextSibling |
获取已知节点的后一个节点 |
| parentNode |
子节点.parentNode |
获取已知节点的父节点 |
| nodeType |
节点.nodeType |
判断节点类型
|
| children<兼容火狐> |
oUl.children.length |
获取子节点 |
| offsetParent |
|
返回最近的祖先定位元素。 |
2、节点操作---创建节点、插入节点、替换节点、复制节点、删除节点
| 节点操作 |
语法 |
功能 |
| 创建:createElement |
document.createElement(元素标签) |
创建元素节点 |
| 创建:createAttribute |
document.createAttribute(元素属性) |
创建属性节点 |
| 创建:createTextNode |
document.createTextNode(文本内容) |
创建文本节点 |
| 插入:appendChild |
appendChild(所添加的新节点) |
向节点的子节点列表的末尾添加新的子节点 |
| 插入:insertBefore |
insertBefore(所要添加的新节点，已知子节点) |
在已知子节点前插入一个新的子节点 |
| 替换:replaceChild |
replaceChild(要插入的新元素，将被替换的老元素) |
将某个子节点替换为另外一个 |
| 复制:cloneNode |
需要被复制的节点.cloneNode(true/false) |
创建指定节点的副本，true复制当前节点及其所有子节点，false仅复制当前节点 |
| 删除:removeChild |
removeChild(要删除的节点) |
删除指定的节点 |
3、属性操作--获取属性、设置属性、删除属性
| 属性操作 |
语法 |
功能 |
| 获取：getAttribute |
元素节点.getAttribute(元素属性名) |
获取元素节点中指定属性的属性值 |
| 设置：setAttribute |
元素节点.setAttribute(属性名,属性值) |
创建或改变元素节点的属性 |
| 删除：removeAttribute |
元素节点.removeAttribute(属性名) |
删除元素中的指定属性 |
4、文本操作
| 文本操作 |
功能 |
| insertData(offset,String) |
从offset指定的位置插入String |
| appendData(String) |
将string 插入到文本节点的末尾处 |
| deleteData(offset,count) |
从offset起删除count个字符 |
| replaceData(off,count,String) |
从off将count个字符用string替代 |
| splitData(offset) |
从offset起将文本节点分为两个节点 |
| substring(offset,count) |
返回由offset起的count个节点 |