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屬性)