首页 > 代码库 > dom小总结

dom小总结

2024-07-04 01:15:44   226人阅读

 

DOM是W3C的标准，分为3个不同的部分：

核心DOM：针对任何结构化文档的标准模型，XML DOM：针对XML文档的标准模型，HTML DOM：针对HTML文档的标准模型。

HTML DOM中所有事物都是节点：

整个文档是文档节点，HTML元素是元素节点，HTML属性是属性节点，HTML内容是文本节点，注释是注释节点。

DOM的一些方法：

方法                                        描述                                                                                    
getElementById() 返回带有指定ID的元素
getElementsByTagName() 返回包含带有指定标签名称的所有元素的节点数组,length获取数组长度
getElementsByClassName() 返回包含带有指定类名的所有元素的节点数组,length获取数组长度
appendChild() 加入新节点  parentNode.appendeChild(newNode)
removeChild() 删除指定节点 parentNode.removeChild(theNode)
replaceChild() 替换指定节点 parentNode.replaceChild(newNode,theNode)
insertBefore() 在指定节点前插入新节点 parentNode.insertBefore(newNode,theNode)
createAttribute() 创建属性节点
createElement() 创建元素节点,var para=document.createElement("p");
createTextNode() 创建文本节点
getAttribute() 返回指定的属性值 但是一般这样获取：document.getElementById("p2").style.color
setAttribute() 把指定属性设置或修改为指定的值 node.setAttribute("attribute","value")

 

 

 

 

 

 

 

 

 

 

 

 

DOM的一些属性：

属性  描述
parentNode 返回父节点  xx.parentNode
childNodes[i] 返回第i+1个子节点
attributes[i] 返回第i+1个属性节点
firstChild 返回第一个子节点
lastChild 返回最后一个子节点
nextSibling　　　　　　　　　 返回下一个兄弟节点
previousSibling 返回上一个兄弟节点
innerHTML 获取元素内容
nodeName 只读,规定节点的名称
  元素节点的nodeName与标签名相同
  属性节点的nodeName与属性名相同
  文本节点的nodeName始终是#text
  文档节点的nodeName始终是#document
nodeValue 规定节点的值
  元素节点的 nodeValue 是 undefined 或 null
  文本节点的 nodeValue 是文本本身
  属性节点的 nodeValue 是属性值
nodeType（返回节点类型，只读） 1:元素,2:属性,3:文本,8:注释,9:文档
onclick document.getElementById("myBtn").onclick=function(){xx()};
document.documentElement 访问全部文档,alert(document.documentElement);
document.body 访问body内容
document.head 访问头部内容


联系
我们