檔案物件代表您的網頁,
如果您希望訪問 HTML 頁面中的任何元素,那么您總是從訪問 document 物件開始,
下面是一些如何使用 document 物件來訪問和操作 HTML 的實體,
查找 HTML 元素
| 方法 | 描述 |
|---|---|
| document.getElementById(id) | 通過元素 id 來查找元素 |
| document.getElementsByTagName(name) | 通過標簽名來查找元素 |
| document.getElementsByClassName(name) | 通過類名來查找元素 |
改變 HTML 元素
| 方法 | 描述 |
|---|---|
| element.innerHTML = new html content | 改變元素的 inner HTML |
| element.attribute = new value | 改變 HTML 元素的屬性值 |
| element.setAttribute(attribute, value) | 改變 HTML 元素的屬性值 |
| element.style.property = new style | 改變 HTML 元素的樣式 |
添加和洗掉元素
| 方法 | 描述 |
|---|---|
| document.createElement(element) | 創建 HTML 元素 |
| document.removeChild(element) | 洗掉 HTML 元素 |
| document.appendChild(element) | 添加 HTML 元素 |
| document.replaceChild(element) | 替換 HTML 元素 |
| document.write(text) | 寫入 HTML 輸出流 |
添加事件處理程式
| 方法 | 描述 |
|---|---|
| document.getElementById(id).onclick = function(){code} | 向 onclick 事件添加事件處理程式 |
查找 HTML 物件
首個 HTML DOM Level 1 (1998),定義了 11 個 HTML 物件、物件集合和屬性,它們在 HTML5 中仍然有效,
后來,在 HTML DOM Level 3,加入了更多物件、集合和屬性,
| 屬性 | 描述 | DOM |
|---|---|---|
| document.anchors | 回傳擁有 name 屬性的所有 <a> 元素, | 1 |
| document.applets | 回傳所有 <applet> 元素(HTML5 不建議使用) | 1 |
| document.baseURI | 回傳檔案的絕對基準 URI | 3 |
| document.body | 回傳 <body> 元素 | 1 |
| document.cookie | 回傳檔案的 cookie | 1 |
| document.doctype | 回傳檔案的 doctype | 3 |
| document.documentElement | 回傳 <html> 元素 | 3 |
| document.documentMode | 回傳瀏覽器使用的模式 | 3 |
| document.documentURI | 回傳檔案的 URI | 3 |
| document.domain | 回傳檔案服務器的域名 | 1 |
| document.domConfig | 廢棄,回傳 DOM 配置 | 3 |
| document.embeds | 回傳所有 <embed> 元素 | 3 |
| document.forms | 回傳所有 <form> 元素 | 1 |
| document.head | 回傳 <head> 元素 | 3 |
| document.images | 回傳所有 <img> 元素 | 1 |
| document.implementation | 回傳 DOM 實作 | 3 |
| document.inputEncoding | 回傳檔案的編碼(字符集) | 3 |
| document.lastModified | 回傳檔案更新的日期和時間 | 3 |
| document.links | 回傳擁有 href 屬性的所有 <area> 和 <a> 元素 | 1 |
| document.readyState | 回傳檔案的(加載)狀態 | 3 |
| document.referrer | 回傳參考的 URI(鏈接檔案) | 1 |
| document.scripts | 回傳所有 <script> 元素 | 3 |
| document.strictErrorChecking | 回傳是否強制執行錯誤檢查 | 3 |
| document.title | 回傳 <title> 元素 | 1 |
| document.URL | 回傳檔案的完整 URL | 1 |
文章來源:www.sysoft.net.cn,加v:15844800162深度交流
轉載請註明出處,本文鏈接:https://www.uj5u.com/qita/163644.html
標籤:其他
上一篇:中芯受限,Mate40終成絕唱,北斗系統能否指明自研方向
下一篇:高級圖形繪制軟體的原理猜想
