1.DOM
DOM（document object model）的縮寫绎巨，文檔對象模型
document對象：js會將整個當前網頁轉換成一個js對象--document;
如果想要通過js來獲取網頁中的內容，必須通過document來獲雀甓汀和媳；
這個對象系統(tǒng)自動創(chuàng)建窗价，程序員只需要使用
document結構：是一個樹結構叹卷，樹下面就是各種節(jié)點（Node, 是js中element對象指向的html中的標簽）
element對象有哪些屬性坪它，就看element對應的標簽有哪些
1.獲取節(jié)點
1.1 直接獲取
a.通過id值來獲取節(jié)點: document.GetElementById(屬性值) -- 返回是標簽對應的節(jié)點對象
補充：html標簽在js全部都是對象往毡，標簽的屬性就是對象的屬性靶溜；雙標簽的內容對應是innerText和innerHTML屬性
innerHTML指向的是內容的文本和標簽：innerText只指向內容中的文本 -- 返回到的是字符串
b.通過class值獲取節(jié)點 -- 返回一個數(shù)組
c.通過標簽名獲取節(jié)點： -- 返回一個數(shù)組
d.通過name屬性獲取節(jié)點 -- 返回數(shù)組
1.2.獲取父節(jié)點 -- 子節(jié)點.parentElement:獲取指定節(jié)點對應的父節(jié)點
1.3.獲取子節(jié)點 -- 獲取指定節(jié)點的所有子節(jié)點
a.獲取所有的子節(jié)點 -- 節(jié)點.children
b.獲取第一個子節(jié)點 - 節(jié)點.firstElementChild
c.獲取最后一個子節(jié)點 -- 節(jié)點.lastElementChild
2.創(chuàng)建節(jié)點
document.createElement(標簽名) -- 創(chuàng)建指定標簽對象的節(jié)點對象
注意：創(chuàng)建的節(jié)點在沒有添加在網頁中的時候是不會顯示的
3.添加節(jié)點
節(jié)點1.appendChild(節(jié)點2) -- 在節(jié)點1的最后添加節(jié)點2
節(jié)點1.insertBefore(節(jié)點2，節(jié)點3) -- 在節(jié)點1的子節(jié)點3之前插入節(jié)點2
4.拷貝節(jié)點
節(jié)點.cloneNode() -- 復制指定節(jié)點嗤详，產生一個新的節(jié)點
5.刪除節(jié)點
a.節(jié)點1.removeChild(節(jié)點2) -- 刪除節(jié)點1中的節(jié)點2
b.直接刪除某個節(jié)點
2.BOM
1.BOM(browser object model)
js自帶一個window對象葱色，指向當前瀏覽器娘香；js中所有的全局變量都是綁定在window對象上的屬性
2.window基本操作
1)打開新的窗口：
a.open(url) -- 在新的窗口打開網址
2)打開新的窗口，同時設置窗口的寬度和高度 --
3)關閉窗口 --window.close()
3)移動當前窗口 -- new_window2.moveTo(100, 100)
4)獲取窗口的寬度和高度 -- innerWidth淋昭，innerHeight -- 獲取瀏覽器能夠顯示內容的部分的寬高
- outerHeight安接，outerWidth -- 獲取窗口的寬高
3.彈框
1）只有確定按鈕再加提示信息的彈框
alert('提示信息')
2）一個提示信息，再點擊確定和取消按鈕呀打；根據返回值是true還是false來判斷選擇是確定還是取消
result = confirm('是否刪除')
3）一個提示信息贬丛，再加一個輸入框和取消確定按鈕给涕；根據返回值是否是null來判斷點擊的是取消還是確定
prompt('提示信息1', '提示信息2')
1.定時時間
1）.setTimeout -- 開啟定時
setTimeout(函數(shù)，定時時間够庙，實參對象) -- 指定時間后調用指定函數(shù)耘眨，并且傳入指定的參數(shù)；返回一個定時器對象
函數(shù) - 可以匿名函數(shù)剔难，也可以是普通函數(shù)的函數(shù)名
定時時間 - 單位是毫秒
實參列表 - 給函數(shù)提供參數(shù)
2）setInterval(函數(shù),定時時間,參數(shù)列表) -- 每隔指定時間調用一次函數(shù)
2.清除定時
定時對象.clearTimeout()
定時對象.clearInterval
3.事件
js是事件驅動語言
1.事件三要素：事件源、事件非迹、事件驅動程序
事件源發(fā)生某個事件就做什么事情（事件驅動程序）
function btnClick(){
result = confirm('是否刪除？')
if (result){
document.getElementById('btn1').remove()
}
}
2.事件的綁定
1）在標簽內部給標簽的事件屬性賦值
注意：這種方式綁定的時候冷离，this指向的是window
<button id='btn1' onclick="btnClick()">刪除1</button>
2）.通過給節(jié)點對象的事件屬性賦值來綁定
注意：這種方式綁定的時候纯命，this指向的是事件源
btnNode = document.getElementById('btn3')
btnNode.onclick = btnClick
3)通過addEventListener方法來進行綁定
a.語法：事件源.addEventListener(事件名稱，函數(shù)-事件驅動程序)
b.說明: 事件名稱 - 事件屬性名去掉on
事件驅動程序 - 事件發(fā)生后需要調用的函數(shù)
c.注意: this指向事件源
可以給同一個節(jié)點的同一個事件綁定不同的事件驅動程序
常見事件類型
1.onload事件 - 頁面加載完成對應的事件（標簽加載成功）
window.onload = function(){
//寫在onload里面的代碼蔫耽，在頁面加載完成后才會執(zhí)行
pNode = document.getElementById('p1')
}
2.鼠標事件
1）onclick -- 鼠標點擊事件
2）onmouseover
- onmouseout
3.鍵盤事件 -- 鍵盤事件一般綁定在輸入框對應的標簽上
1）onkeypress - 鍵盤按下彈起
2）onkeydown - 按鍵按下留夜， onkeyup -- 按鍵彈起
4.輸入框事件
onchange -- 輸入框的內容發(fā)生改變
oninput - 正在輸入
5.事件對象（event） -給事件驅動參數(shù)加參數(shù)event
每個事件驅動程序中，都可以設置一個參數(shù)鳖眼，來表示當前事件對象钦讳，不同類型的事件對應事件類型和事件屬性不同
1）鼠標事件對象
clientX/clientY -- 鼠標的位置到瀏覽器左邊和頂部的距離
offsetX/offsetY -- 鼠標的位置到事件源標簽左邊和頂部的距離
2）鍵盤事件對象
key - 那個按鍵被按下
