本文內容承接Javascript特效開發（二）
第五章? ? Javascript特效開發第四階段
5.1瀏覽器對象模型-BOM
Browser Object Model
window對象 是BOM中所有對象的核心。
（1）window對象--定時器
在使用過程中setInterval(函數名,100);?可以寫方法在定時器中調用，但是卻不能寫帶有參數的函數名。
解決方法：（可以傳參數的定時器）匿名方法中調用含參方法。
（2）window對象--其它方法
confirm()彈出對話框，確定或取消選擇，返回值：確定true，取消false。
（3）history對象
history常用屬性和方法：
history.go(-1);表示跳轉至歷時頁面中的上一個訪問頁面。
（4）location對象
location.href='www.baidu.com';效果與 location.replace('www.baidu.com')/assign('www.baidu.com');效果相同。
5.2事件綁定與事件監聽
需要操作body里元素的時候需要加window.onload
window.onload = function(){..........................................};
（1）事件綁定
（1）通過JS腳本綁定事件
（2）通過html標簽綁定事件
（2）事件監聽(需判斷瀏覽器，w3c與ie低版本存在兼容問題):
document.all 在低版本的ie可以識別，但在火狐chrome等不能識別。
5.3獲得和設置圖片的行內樣式
此處僅限行內樣式的獲取修改。
5.4圖片隱藏&JS運動效果原理
隱藏：document.getElementById("xx").style.display='none';
顯示：document.getElementById("xx").style.display='';如果用block會影響后面的元素換行
js實現運動效果：
利用定時器定時器和位置變化：
設置定時器（setInterval）：獲取之前的間隔，計算新的間隔，將距離間隔設置給元素屬性。
解決定時器疊加的處理方法：在設置定時器之前，先清理定時器；
依次類推，還可實現圖片往返跑，加速跑等效果。
5.5document對象模型（DOM）
（1）什么是DOM
（2）屬性
title 返回或者是當前文檔的標題。
document.title;獲得title標簽中的內容。
document.title=‘哈哈’;設置title標簽內容。
?輸出調試方法：
a.根據標題欄變化找原因。
b.使用console.log()；
c.alert ();
（3）dom抓元素的幾種方式
通過id（getElement...）抓過來的元素只有一個。
通過其他class/標簽名/name屬性（getElements...）抓到的元素會以數組形式返回回來，哪怕只抓到一個元素。
name屬性一般表單使用較多。
其他抓取方式：
getElementById('fu').getElementsByClassName('zi'); ?可以先通過id抓取到父元素，再去通過class/標簽名/name屬性抓取子元素。
但不可以通過Id抓Id : ?getElementById('fu').getElementsById('zi');
（4）對元素內容的獲取和設置
a.innerHTML（大多數情況下使用innerHTML）
b. 或取純文本內容 innerTEXT（ie低版本） & textContent（w3c）
兼容性短路寫法：
c.倒計時跳轉
使用這些特性還可以實現其他效果，如文字復制粘貼，區域文字的轉換等。
（5）對元素屬性的操作
初學者很容易將元素屬性和元素樣式混淆，元素屬性是指id,calss,name,value,a標簽的href,img標簽的src等，而元素樣式是指寬度、高度、間距等。
實現動畫效果：
（6）獲得實際作用在元素身上的樣式
（7）dom模型 通過關系抓元素
（8）節點操作--節點的創建 追加 復制 替換 刪除（元素節點）
復制節點xx.cloneNode(true); 不加true只復制一個標簽結構（即空標簽）沒有內容，所以加上參數true，將標簽結構及內容一同復制。
復制節點可用于點擊增加上傳框（用于上傳圖片，添加更多）。
《Javascript特效開發（一）》、《Javascript特效開發（二）》以及《Javascript特效開發（三）》對Javacript的ECMAscript部分、DOM和BOM部分進行基礎知識講解。
更多Javascript常用基礎內容會在《Javascript特效開發（四）》中講解。鏈接：www.lxweimin.com/p/2d40d3fc0bb6
如有問題歡迎交流。
如轉載請注明出處，謝謝！
