HTML DOM 实例

使用JavaScript访问和操作的HTML DOM对象的例子。

Document 对象

• 使用 document.write() 输出文本

• 使用 document.write() 输出 HTML

• 返回文档中锚的数目

• 返回文档中第一个锚的 innerHTML

• 返回文档中表单的数目

• 返回文档中第一个表单的名字

• 返回文档中的图像数

• 返回文档中第一个图像的ID

• 返回文档中的链接数

• 返回文档中的第一个链接的ID

• 返回文档中的所有cookies的名称/值对

• 返回加载的文档的服务器域名

• 返回文档的最后一次修改时间

• 返回加载的当前文档的URL

• 返回文档的标题

• 返回文档的完整的URL

• 打开输出流，向流中输入文本

• write() 和 writeln()的不同

• 用指定的ID弹出一个元素的innerHTML

• 用指定的Name弹出元素的数量

• 用指定的tagname弹出元素的数量




• 更多的Document  对象的例子，在我们的JavaScript  参考手册。

Anchor  对象

• 返回和设置链接的charset属性

• 返回和设置链接的href属性

• 返回和设置链接的hreflang属性

• 返回一个锚的名字

• 返回当前的文件和链接的文档之间的关系

• 改变链接的target属性

• 返回一个链接的type属性的值

• 更多的Anchor 对象的例子，在我们的JavaScript  参考手册。

Area  对象

• 返回图像映射某个区域的替代文字

• 返回图像映射某个区域的坐标

• 返回一个区域的href属性的锚部分

• 返回的主机名：图像映射的某个区域的端口

• 返回图像映射的某个区域的hostname

• 返回图像映射的某个区域的port

• 返回图像映射的某个区域的href

• 返回图像映射的某个区域的pathname

• 返回图像映射的某个区域的protocol

• 返回一个区域的href属性的querystring部分

• 返回图像映射的某个区域的shape

• 返回图像映射的某个区域的target的值

• 更多的Area  对象的例子，在我们的JavaScript 参考手册。

Base   对象

• 返回页面上所有相对URL的基URL

• 返回页面上所有相对链接的基链接

• 更多的Base  对象对象的例子，在我们的JavaScript 参考手册。

Button  对象

• 当点击完button不可用

• 返回一个button的name

• 返回一个button的type

• 返回一个button的value

• 返回一个button所属表的ID

• 更多Button  对象实例在我们的JavaScript 参考手册。

Form   对象

• 返回一个表单中所有元素的value

• 返回一个表单acceptCharset属性的值

• 返回一个表单action属性的值

• 返回表单中的enctype属性的值

• 返回一个表单中元素的数量

• 返回发送表单数据的方法

• 返回一个表单的name

• 返回一个表单target属性的值

• 重置表单

• 提交表单

• 更多Button  对象实例在我们的JavaScript 参考手册。

Frame/IFrame  对象

• 对iframe排版

• 改变一个包含在iframe中的文档的背景颜色

• 返回一个iframe中的frameborder属性的值

• 删除iframe的frameborder

• 改变iframe的高度和宽度

• 返回一个iframe中的longdesc属性的值

• 返回一个iframe中的marginheight属性的值

• 返回一个iframe中的marginwidth属性的值

• 返回一个iframe中的name属性的值

• 返回和设置一个iframe中的scrolling属性的值

• 改变一个iframe的src

• 更多Frame/IFrame  对象实例在我们的JavaScript 参考手册。

Image   对象

• 对image排版

• 返回image的替代文本

• 给image加上border

• 改变image的高度和宽度

• 设置image的hspace和vspace属性

• 返回image的longdesc属性的值

• 创建一个链接指向一个低分辨率的image

• 返回image的name

• 改变image的src

• 返回一个客户端图像映射的usemap的值

• 更多Image  对象实例在我们的JavaScript 参考手册。

Event   对象

• 哪个鼠标键被点击了？

• 被按下的键盘键的keycode？

• 鼠标的坐标？

• 鼠标相对于屏幕的坐标？

• shift键被按下了吗？

• 哪个元素被按下了？

• 哪个事件发生了？

Option 和 Select  对象

• 禁用和启用下拉列表

• 获得有下拉列表的表单的ID

• 获得下拉列表的选项数量

• 将下拉列表变成多行列表

• 在下拉列表中选择多个选项

• 弹出下拉列表中所有选项

• 弹出下拉列表中被选中的选项的索引

• 改变下拉列表中被选中的选项的文本

• 删除下拉列表中的选项

Table, TableHeader, TableRow, TableData  对象

• 改变表格边框的宽度

• 改变表格的cellpadding和cellspacing

• 指定表格的frame

• 为表格指定规则

• 一个行的innerHTML

• 一个单元格的innerHTML

• 为表格创建一个标题

• 删除表格中的行

• 添加表格中的行

• 添加表格行中的单元格

• 单元格内容水平对齐

• 单元格内容垂直对齐

• 对单个单元格的内容水平对齐

• 对单个单元格的内容垂直对齐

• 改变单元格的内容

• 改变单元格横跨的列数(colspan属性)