javascript Dom操作

获取指定ID节点
document.getElementById();

获取name节点
document.getElementsByName();

获取tag节点
document.getElementsByTagName();

获取节点属性
elementNode.getAttribute();

设置节点属性
elementNode.setAttribute();

获取节点名称
elementNode.nodeName();

1. 元素节点的 nodeName 与标签名相同
2. 属性节点的 nodeName 是属性的名称
3. 文本节点的 nodeName 永远是 #text
4. 文档节点的 nodeName 永远是 #document

获取节点的值
elementNode.nodeValue();

1. 元素节点的 nodeValue 是 undefined 或 null
2. 文本节点的 nodeValue 是文本自身
3. 属性节点的 nodeValue 是属性的值

获取节点的类型
elementNode.nodeType();

元素类型 节点类型
元素 1
属性 2
文本 3
注释 8
文档 9

获取节点的子节点
elementNode.childNodes

获取节点的第一个子节点
elementNode.firstChild

获取节点的最后一个子节点
elementNode.lastChild

获取节点的父节点
elementNode.parentNode

获取节点的同级下一个节点
elementNode.nextSibling

获取节点的同级上一个节点
elementNode.previousSibling

插入节点至节点的最后一个子节点后
elementNode.appendChild(newnode)

插入节点至指定子节点前
elementNode.insertBefore(newnode,node)

从节点的子节点列表中删除指定节点
elementNode.removeChild(node)
返回删除的节点,失败返回null

替换节点中的子节点
elementNode.replaceChild(newnode,node)
返回被替换节点的引用

创建元素节点
document.createElement(tagName)
返回创建元素的节点对象

创建文本节点
document.createTextNode(data)
返回创建的文本节点

获取浏览器窗口尺寸
IE和其他浏览器获取方式不同
document.documentElement.clientWidth || document.body.clientWidth;
document.documentElement.clientHeight || document.body.clientHeight;

获取网页内容尺寸
IE Opera和其他浏览器不同
document.documentElement.scrollWidth || document.body.scrollWidth;
document.documentElement.scrollHeight || document.body.scrollHeight;

获取网页内容尺寸包括滚动条和边框
offset = client + 边框 + 滚动条
document.documentElement.offsetWidth || document.body.offsetWidth;
document.documentElement.offsetHeight || document.body.offsetHeight;

获取网页卷去的距离与偏移量
scrollLeft:设置或获取位于给定对象左边界与窗口中目前可见内容的最左端之间的距离。
scrollTop:设置或获取位于对象最顶端与窗口中可见内容的最顶端之间的距离。
offsetLeft:获取指定对象相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置 。
offsetTop:获取指定对象相对于版面或由 offsetParent 属性指定的父坐标的计算顶端位置 。

Categories: javaScript, 前端开发