DOM访问

对于dom访问还不大理解，去网上搜集了资料，并做了简单的总结，其实访问 HTML DOM 就是查找 HTML 元素。上节中提到每个 XML 元素是一个元素节点，所以访问 HTML 元素等同于访问节点。下面就我自己的理解来简单介绍几个dom访问的方法。

访问标签中的文本

<p><em>second</em> paragraph</p>

我们可以通过元素的textContent属性来获取段落中的文本内容。如果我们使用的是不支持textContent属性的IE浏览器，则通过另一个叫innerText的属性来返回相同的值。

bd.childNodes[1].textContent;

另外，我们也可以通过innerHTML属性来解决上述问题。该属性会返回指定节点中所有的HTML代码，返回的只是标签字符串而已。

bd.childNodes[1].innerHTML

如果某个节点中只有文本，那么它的innerHTML值和textContent完全相同。如果节点中还包含标签，两者的不同就会显现出来： 除此之外，获得段落p的文本内容还有一种方式，即访问p节点内容的文本节点，读取它的nodeValue属性。

快捷的访问方法

getElementById() 和 getElementsByTagName()

getElementById() 和 getElementsByTagName() 这两种方法，可查找整个 HTML 文档中的任何 HTML 元素。

这两种方法会忽略文档的结构。如果你想要查找文档中所有的 <p> 元素，不管 <p> 元素处于文档中的哪个层次，getElementsByTagName() 会把它们全部找到。同时，不论它被隐藏在文档结构中的什么位置，getElementById() 方法也会返回正确的元素。这两种方法会帮助你找到任何你所需要的 HTML 元素。这两种方法既然这么方便，那它们又是怎么工作的呢？我们一起来了解一下。

getElementsByTagName() ：该方法是通过节点的name获取节点，从名字可以看出，这个方法返回的不是一个节点元素，而是具有同样名称的节点数组。然后，我们可以通过要获取节点的某个属性来循环判断是否是我们需要的节点。例如：在HTML中checkbox和radio都是通过相同的name属性值，来标识一个组内的元素。如果我们现在要获取被选中的元素，首先获取改组元素，然后循环判断节点的checked属性值是否为true即可。

语法

node.getElementsByTagName("tagname"); 

实例

下面的实例返回 x 元素下的所有 <title> 元素：

x.getElementsByTagName("title"); 

请注意，上面的实例仅返回 x 节点下的 <title> 元素。如需返回 XML 文档中的所有 <title> 元素，请使用：

xmlDoc.getElementsByTagName("title"); 

在这里，xmlDoc 就是文档本身（文档节点）。

getElementById()：该方法通过节点的ID，可以准确获得需要的元素，是比较简单快捷的方法。如果页面上含有多个相同id的节点，那么只返回第一个节点。

语法

document.getElementById("ID"); 

注意：getElementById() 无法在 XML 中工作。在 XML 文档中，你必须通过拥有id 类型 的属性来进行搜索，而此类型必须在 XML DTD 中进行声明。

下面这个例子会返回所有 <p> 元素的一个节点列表，且这些 <p> 元素必须是 id 为 "maindiv" 的元素的后代：

document.getElementById('maindiv').getElementsByTagName("p"); 

访问CSS样式表类

我们写的网页页面中有时用了style特性的元素CSS样式，并没有通过直接写在对象里面的style定义，这样的CSS怎么通过javascript的dom访问呢。

首先，我们要做的是获得定义样式表CSS的引用。我们可以使用document.styleSheets集合来实现获取。Dom指定样式表对象有以下特性

1.disabled-表示样式表是否被禁用
2.href-用于外部引用文件样式表的url，对于style元素来说，该值应该是null,不过在Mozilla中返回的是当前页面的url值
3.media-可以使用该样式表的媒体类型,由html的media特性指定,IE在实现这个属性上有错误，返回的是与media特性包含相同内容的字符串。
4.ownerNode-指定样式的DOM节点。IE不支持该属性
5.parentStyleSheet-如果样式表是通过CSS的@import语句来加载的，那么这个特性将指出出现@import语句的样式表。
6.title-通过HTML title特性非配给样式表的标题，可以用在<link/><style/>上。
7.type-样式的mime类型，对于CSS通常是text/css.

因为我们所使用的浏览器不同,访问样式表中单独的规则也是有技巧的.dom为每一个样式表指定了一个cssRules的集合,它包含所有的定义在样式表中的CSS的规则。火狐Mozilla和苹果的Safari正确的实现了该标准,不 过IE是通过rules.因此要检查一下，该使用那个。

示例：

var obj_css = document.styleSheets[0].cssRules ||document.styleSHeets[0].rules;