Javascript中Dom元素基本操作方法API.pdf

JS DOM JS DOM JJSSDDOOMM Dom 元素基本操作方法API W3C DOM和JavaScript很容易混淆不清。DOM 是面向HTML和XML文档的API，为 文档提供了结构化表示，并定义了如何通过脚本来访问文档结构。JavaScript则是用于访问和 处理DOM的语言。如果没有 DOM，JavaScript根本没有Web页面和构成页面元素的概念。 文档中的每个元素都是DOM的一部分，这就使得JavaScript可以访问元素的属性和方法。 DOM独立于具体的编程语言，通常通过JavaScript 访问DOM，不过并不严格要求这样。 可以使用任何脚本语言来访问DOM，这要归功于其一致的API。表3-1列出了DOM元素的一 些有用的属性，表3-2列出了一些有用的方法。 表3-1 用于处理XML文档的DOM元素属性 属性名 描述 childNodes 返回当前元素所有子元素的数组 firstChild 返回当前元素的第一个下级子元素 lastChild 返回当前元素的最后一个子元素 nextSibling 返回紧跟在当前元素后面的元素 nodeValue 指定表示元素值的读/写属性 parentNode 返回元素的父节点 previousSibling 返回紧邻当前元素之前的元素 表3-2 用于遍历XML文档的DOM元素方法 方法名 描述 getElementById(id) (document) 获取有指定惟一ID属性值文档中的元素 getElementsByTagName_r(name) 返回当前元素中有指定标记名的子元素的数组 hasChildNodes() 返回一个布尔值，指示元素是否有子元素 getAttribute(name) 返回元素的属性值，属性由name指定 有了W3CDOM，就能编写简单的跨浏览器脚本，从而充分利用XML的强大功能和灵活性， 将XML作为浏览器和服务器之间的通信介质。 W3C DOM JavaScript XML 从下面的例子可以看到，使用遵循 的 来读取 文档是何等简单。 代码清单3-3显示了服务器向浏览器返回的XML 文档的内容。这是一个简单的美国州名列表， 各个州按地区划分。 表3-3 动态创建内容时所用的W3C DOM 属性和方法 属性/方法 描述 document.createElement_x(tagName) 文档对象上的createElement_x方法可以创建由 tagName 指定的元素。如果以串div 作为方法参数，就会生成一个div元素 document.createTextNode(text) 文档对象的createTextNode方法会创建一个包含静态文 本的节点 element.appendChild(childNode) appendChild 方法将指定的节点增加到当前元素的 子节点列表（作为一个新的子节点）。例如，可以增加一个option元素，作为select元素的子 节点 element.getAttribute(name) element.setAttribute(name, value)这些方法分别获得和设置元素中name 属性的值 element.insertBefore(newNode, targetNode)将节点newNode作为当前元素的子节 点插到targetNode元素前面 element.removeAttribute(name) 这个方法从元素中删除属性name element.removeChild(childNode) 这个方法从元素中删除子元素childNode element.replaceChild(newNode, oldNode) 这个方法将节点 oldNode 替换为节点 newNode element.hasChildnodes() 这个方法返回一个布尔值，指示元素是否有子元素 Document－－最顶层的节点，所有的其他节点都是附属于它的。 DocumentType－－DTD引用（使用!DOCTYPE语法）的对象表现形式，它不能包含