一. 節點操作

　　nodeType:  1 --> 元素節點  2--> 屬性節點  3-->文字節點

二.  動態建立元素 (元素就是一個標籤):

　　　　1) document.write()   : 清除頁面其他所有元素

　　　　2) dom.innerHTML = 

　　　　3) var p = dom.createElement('p')

　　元素的增刪改查: 

　　　　1) 增: createElement('p')     box.appendChild(p) 

　　　　　　　　如果appendChild()的元素在文件中已經存在, 會想一出原先的元素, 這時候要先克隆  標籤.cloneNode()

　　　　2) 刪: removeChild() 

　　　　3) 改: insertBefore(新元素, 插在那個元素之前)    replaceChild(新元素, 舊元素)

　　　　4) 查:  元素選擇器

三.  操作

　　1)自定義屬性操作 :  setAttribute('index', i)  getAttribute()  removeAttribute()

　　2)類名操作:  box.classList.add()  .classList.remove()  

　　3)樣式操作:  box.style.width = "100px"

　　4) 表單元素的屬性:  input.typ == 'checkbox'   input.cheked == true     input.value

四. dom事件 addEventListener   removeEventListener  jquery 中不能呼叫事件監聽

五.  事件物件 e  的屬性 e.clientX  e.clientY

　　取消預設行為  e.preventDefault ;   return false

l六.  常用事件: onfocus  onblur onchange 

　　鍵盤和滑鼠事件: 

　　　　　　onmousedown  onmouseup onmousemove  onmouseenter(mouseover會觸發父元素的冒泡事件)

　　　　　　onkeyup onkeydown  ==>keyCode

七.bom 瀏覽器事件: 

　　　　1) onload 

　　　　2) setInterval    setTimeout 

　　　　3)location物件 .href = ' url '     location.reload()   location.assign(可倒退)   location.replace(bu能倒退)      

　　　　4)history物件  .back()    .forward()    .go(1)/1代表前進, -1代表後退

　　　　5)頁面偏移量 box.clientWidth(content + padding)  box.clientTop(border-top)  offsetLeft(content+padding+border+margin)

　　　　　　window.onscroll = function( ){

　　　　　　　　//body 的相容性寫法   body || documentELement

　　　　　　　　var top = document.body.scrollTop;

　　　　　　　　var top = docuement.docuemntELement.scrollTop;

　　　　　　}; 滾動事件  ;scrollTop 向上滾動距離