今天看一个同事写的一段JS代码，完全使用原生的Dom方法，想想自己好久没有使用原生的方法了，一直在框架中游走，不由得复习一下常用的DOM属性与方法，同时记录下来，以便今后查阅。
DOM常用方法
/*
@function createElement 按照给定的标签名创建一个新的元素节点
@param element string 将被创建的元素名字
@return interface 指向新建元素节点的引用
*/
reference = document.createElement(element)
/*
@function createTextNode 按照给定的文本创建一个新的文本节点
@param text string 新建文本节点所包含的文本字符串
@return interface 指向新建文本节点的引用
*/
reference = document.createTextNode(text)
/*
@function cloneNode 复制节点
@param deep boolean 是否要把被复制节点的子节点一同复制到新建节点里去
@return interface 指向新建克隆节点的引用
*/
reference = node.cloneNode(deep)
/*
@function appendChild 给元素节点追加一个新的子节点或者文档中现有元素
@param child object 新的节点或者现有元素节点
@return interface 指向新增子节点的引用
*/
reference = element.appendChild(child)
/*
@function insertBefore 把一个给定节点插入到一个给定元素节点的给定子节点的前面
@param newNode object 将插入的新节点
@param targetNode object 给定子节点
@return interface 指向新增子节点的引用
*/
reference = element.insertBefore(newNode, targetNode)
/*
@function removeChild 从一个给定元素里删除一个子节点
@param node object 将要删除的子节点
@return interface 指向已被删除的子节点的引用
*/
reference = element.removeChild(node)
/*
@function replaceChild 把一个给定元素里的一个子节点替换为另外一个节点
@param newChild object 新的子节点
@param oldChild object 旧的子节点
@return interface 指向旧的子节点的引用
*/
reference = element.replaceChild(newChild, oldChild)
/*
@function setAttribute 为给定元素节点添加一个新的属性值或是改变它的现有属性的值
@param attributeName string 属性名称
@param attributeValue string 属性值
*/
element.setAttribute(attributeName, attributeValue)
/*
@function getAttribute 得到给定元素节点的属性的值
@param attributeName string 属性名称
@return attributeValue string 属性值
*/
attributeValue = element.getAttribute(attributeName)
/*
@function getElementById 得到一个给定ID属性值的元素
@param id string 给定ID属性值
@return element object
*/
element = document.getElementById(id)
/*
@function getElementsByTagName 查找给定标签名的所有元素
@param tagName string 给定标签名
@return elements 节点集合
*/
elements = element.getElementById(id)
/*
@function hasChildNodes 检查一个给定元素是否有子节点
@return booleanValue boolean
*/
booleanValue = element.hasChildNodes()
DOM常用属性
- nodeName 返回一个字符串，其内容是给定节点的名字。
- nodeType 返回一个整数，代表着给定节点的类型。
- childNodes 返回一个数组，由给定节点的子节点构成。
- firstChild 返回一个给定元素节点的第一个子节点。
- lastChild 返回一个给定元素节点的最后一个子节点。
- nextSibling 返回一个给定节点的下一个子节点。
- parentNode 返回一个给定节点的父节点。
- previousSibling 返回一个给定节点的下一个子节点。