关于W3C DOM

W 3C    DOM

文档对象模型(DOM)是与平台和语言无关的接口，允许程序和脚本动态地访问和更新文档的内容，结构和样式。文档可以进一步处理，处理的结果可以放回到所提供的页面中。

 

表3-1   用于处理XML文档的DOM元素属性

属性名	描述
childNodes	返回当前元素所有子元素的数组
firstChild	返回当前元素的第一个下级子元素
lastChild	返回当前元素的最后一个子元素
nextSibling	返回紧跟在当前元素后面的元素
nodeValue	指定表示元素值的读/写属性
parentNode	返回元素的父节点
previousSibling	返回紧邻当前元素之前的元素

 

表3-2    用于遍历XML文档的DOM元素方法

方法名	描述
getElementById(id)  (document)	获取有指定唯一ID属性值文档中的元素
getElementsByTagName(name)	返回当前元素中有指定标记名的子元素的数组
hasChildNodes()	返回一个布尔值，指示元素是否有子元素
getAttribute(name)	返回元素的属性值，属性由name指定

 

表3-3    动态创建内容时所用的W 3C DOM属性和方法

属性/方法	描述
document.createElement(tagName)	文档对象上的createElement方法可以创建由tagName指定的元素。如果以串div作为方法参数，就会生成一个div元素
Document.createTextNode(text)	文档对象的createTextNode方法会创建一个包含静态文本的节点
<element>.appendChild(childNode)	appendChild方法将指定的节点增加到当前元素的子节点列表。例如，可以增加一个option元素，作为select元素的子节点。
<element>.getAttribute(name)	这些方法分别获得和设置元素中name属性的值
<element>.setAttribute(name,value)
<element>.insertBefore(newNode,targetNode)	这个方法将节点newNode作为当前元素的子节点插到targetNode元素前面
<element>.removeAttribute(name)	这个方法从元素中删除属性name
<element>.removeChild(childNode)	这个方法从元素中删除子childNode
<element>.replaceChild(newNode,oldNode)	这个方法将节点oldNode替换为节点newNode
<element>.hasChildNodes()	这个方法返回一个布尔值，指示元素是否有子元素

 

关于浏览器的不兼容性

如果使用appendChild将<tr>元素直接增加到<table>中，则在IE中这一行并不出现，但在其他浏览器中却会显示出来，对此的解决之道是，将<tr>元素增加到表的<tbody>元素中，这种解决办法在所有浏览器中都能正确工作。

关于setAttribute方法,IE也有麻烦。IE不能使用setAttribute正确地设置class属性,对此有一个跨浏览器的解决方法，即同时使用setAttribute(“class”,”newClassName”)和setAttribute(“className”, “newClassName”)。另外，在IE中不能使用setAttribute设置style属性。最能保证浏览器兼容的技术不是<element>.setAttribute(“style”, “font-weight:bold”),而是<element>.style.cssText=“font-weight:bold;”。