为了动态的修改HTML元素必须能访問HTML元素，DOM提供了两种方式来访问HTML元素：

• 根据CSS选择器访问HTML元素
• 利用节点关系访问HTML元素

前一种方式简单易用主要有document提供的getElementById()方法来完成；后一種方式则利用树节点之间的父子、兄弟关系来访问。

---

根据ID访问HTML由如下方法来实现
上面这个方法简单易用，只要被访问HTML元素具有唯一的ID属性那么JavaScript脚本就可以方便的范根到该元素。
在设计良好的HTML页面中建议为页面中的每个HTML元素都设置唯一的ID属性值；或者要求其他成员开发HTML頁面时尽量为每个元素设置唯一的id属性值。早期的很多HTML页面并不是很规范的HTML页面而且早期很多页面只是简单的静态页，不需要使用JavaScript动态修改页面内容因此页面中可能有些HTML元素没有指定id属性值。但现在不同了现在可能经常需要动态修改HTML页面内容，经常需要根据ID来访问HTML元素因此建议为每个HTML元素指定唯一的一个id属性值。

下面的页面代码示范了如何根据ID来访问HTML元素

上面的页面中定义了一个id为a的<div……> 元素、┅个id为b的<textarea……>元素，页面中还定义了一个简单按钮当用户单击该按钮时执行accessById()函数，该函数只是弹出一个警告提示框该提示框输出<div……>え素的innerHTML属性和<textarea……>元素的value属性。

在浏览器中浏览该页面并单击页面中的“访问两个元素”按钮，可以看到如上所示截图

从图可以看出，该警告框的内容正好是<div……>元素和<textarea……>元素的“内容”为何一个用innerHTML属性，另一个用value属性呢

这是因为DOM模型扩展了HRML元素，为几乎所有的HTMLえ素都新增了innerHTML属性该属性代表钙元素的内容----当某个元素的开始标签、技术标签之间都是字符串内容时（不含其它子元素），JavaScript子元素可通過它的innerHTML属性返回这些字符串内容但<textarea……>例外，因为他是一个表单控件它的开始标签和结束标签之间的内容是他的值，因此只能通过value属性来访问

不仅如此，还有<input……>元素所生成的表单控件包括单行文本框，各种按钮等他们可视化文本都由value属性控制，因此也通过value获取咜们的“内容”

除此之外的其他HTML元素，包括列表框、下拉菜单的列表项、<label……>表单域、<button……>按钮都应该通过innerHTML来获取他们的“内容”。