1.DHML簡介
由微軟提出, Dynamic HTML 動態網頁技術. 整合了 HTML CSS Javascript DOM 4個技術.可以理解爲對DOM對象的增強: 增加了一些新的屬性和方法.讓我們開發更加便捷.。
DHTML即動態的html
DHTML不是一門新的技術，而是將現有的HTML、CSS、JS結合的一門技術
DHTML分爲BOM和DOM
BOM：瀏覽器對象模型，其中封裝了瀏覽器操作相關的對象
DOM：文檔對象模型，將整個html文檔作爲dom對象
DHML的功能
- 動態改變頁面元素
- 與用戶進行交互等
- DHML對象模型包括瀏覽器對象模型和DOM對象模型
2.BOM
BOM：瀏覽器對象模型，用來訪問和操作瀏覽器窗口，使JavaScript有能力與瀏覽器“對話”。
1.通過使用BOM,可移動窗口，更改狀態欄文本，執行其他不與頁面內容發生直接聯繫的操作
2.沒有相關的標準，但是被廣泛支持
window對象：window表示瀏覽器窗口，所有javaScript全局對象、函數以及變量均自動成爲window對象的成員
常用的事件
onclick事件：當元素被點擊時觸發
onfocus事件：當獲得焦點時觸發
onblur事件：失去焦點事件
onload事件：文檔就緒事件
常用的方法
alert()：彈出提示框
confirm()：彈出確認對話框，返回boolean
3.DOM
DOM：文檔對象類型，用來操作文檔
1.定義了訪問和操作HTML文檔的標準方法
2.應用程序通過對DOM樹的操作，來實現對HTML文檔數據的操作
document對象：每個載入瀏覽器的HTML文檔都會成爲document對象，通過使用document對象，可以從腳本中對HTML頁面中的所有元素進行訪問。document對象是window對象的一部分，可以通過window.document屬性對其進行訪問
3.1.獲取元素
document.getElementById("id值") 根據id獲取一個元素
document.getElementsByTagName("元素名") 根據元素的名稱獲取多個元素組成的數組
document.getElementsByName("name值") 根據元素的name屬性獲取多個元素組成的數組
value屬性：可以獲取或者設置元素的value值
innerText：（部分瀏覽器不支持）獲取或者設置元素的文本內容
innerHTML：獲取或者設置元素的html內容
3.2.元素的操作
document.createElement("div")：創建div元素
body.appendChild(div)：追加子元素
body.removeChild(div)：刪除子元素
body.replaceChild(newdiv,olddiv)：用新元素替換舊元素
body.insertBefore(newdiv,olddiv)：在舊元素前面插入新的元素
div.cloneNode([boolean])：克隆元素，參數默認false，表示只克隆元素本身，如果是true，則會克隆元素以及子元素