script 頁面中的所有變量寥粹，其實(shí)都是瀏覽器的對(duì)象中的屬性
例如 var num = 10;
實(shí)際上是window.num
window是瀏覽器中的頂級(jí)對(duì)象痰腮，只是window可以不寫出來
BOM還有三大系列：
1. offset系列
2. scroll系列
3.?
1. onload加載頁面事件
2. location對(duì)象
3. history對(duì)象
跟瀏覽器上左右箭頭功能相同神帅，讀取history歷史，進(jìn)行頁面跳轉(zhuǎn)
4. navigator對(duì)象
通過userAgent可以判斷用戶瀏覽器的類型
? ? console.log(window.navigator.userAgent);
? ? //通過platform可以判斷瀏覽器所在的系統(tǒng)平臺(tái)類型.
? ? //console.log(window.navigator.platform);
5. 定時(shí)器
5.1 第一種：永久定時(shí)器
timerId = setInterval(func, timeout);
clearInterval(timerId);
5.2 第二種：一次性定時(shí)器
timerId = setTimeout(func, timeout);
clearTimeout(timerId);
6. 三大系列之系列一：offset系列
js不能直接獲取到定義在<head></head>里的<style></style>中的屬性值备恤，只能通過obj.offsetXxxx來獲取
offsetWidth和offsetHeight獲取的是元素的寬高，而真實(shí)內(nèi)容的寬高只能通過scrollWidth和scrollHeight來獲取
7. 完整輪播圖的思路
? ? * 1. 根據(jù)ul中l(wèi)i個(gè)數(shù)(圖片的個(gè)數(shù))動(dòng)態(tài)的創(chuàng)建li,并且加入到ol中,作為小按鈕來使用
? ? * 為每個(gè)ol中的li添加鼠標(biāo)進(jìn)入的事件,(添加事件之前,先把索引保存在每個(gè)li的自定義屬性中),鼠標(biāo)進(jìn)入li的時(shí)候做排他功能(背景顏色),移動(dòng)圖片(圖片整體移動(dòng),移動(dòng)的ul,每次移動(dòng)的是一個(gè)圖片的寬度,圖片的寬度就是向?qū)挼膶挾?,調(diào)用的是動(dòng)畫函數(shù),移動(dòng)ul,移動(dòng)的是索引值*圖片的寬度,并且把索引值存儲(chǔ)在一個(gè)全局變量中,pic
? ? * 2. 創(chuàng)建li之后,1---設(shè)置ol中第一個(gè)li有默認(rèn)的背景顏色,2---把ul中的第一個(gè)li克隆一下(無縫連接的效果)追加到ul中所有的li的最后面(無縫效果:頁面中的第一個(gè)圖片和最后一個(gè)圖片是同一個(gè)圖片)
? ? * 3.左右焦點(diǎn)的div顯示和隱藏
? ? * 4.為左右按鈕注冊(cè)點(diǎn)擊事件
? ? *? 每一次點(diǎn)擊右邊的按鈕,先判斷pic的值是不是ul中l(wèi)i的length-1(pic的值最大是5),此時(shí)設(shè)置pic的值為0,同時(shí)設(shè)置ul距離左邊的left值為0(初始值),此時(shí)pic立刻加1,移動(dòng)ul,用戶看到的就是第二個(gè)圖片
? ? *? 設(shè)置小按鈕的背景顏色
? ? *? 左邊按鈕,需要判斷pic值是不是0,如果是0此時(shí)pic=5,ul的left為5*圖片的寬,立刻pic-1,然后ul移動(dòng)一張圖片,此時(shí)用戶看到了第五個(gè)圖片
? ? *? 5.自動(dòng)播放在頁面加載的時(shí)候,啟動(dòng)一個(gè)定時(shí)器,里面調(diào)用的就是右邊按鈕的點(diǎn)擊事件的處理函數(shù)
8. 三大系列之系列二：scroll系列
* scrollWidth:元素中內(nèi)容的實(shí)際的寬(沒有邊框),如果沒有內(nèi)容就是元素的寬
? * scrollHeight:元素中內(nèi)容的實(shí)際的高(沒有邊框),如果沒有內(nèi)容就是元素的高
//my$("btn").onclick=function () {
//? //console.log(my$("dv").offsetWidth);//元素的寬,有邊框
//? //console.log(my$("dv").offsetHeight);//元素的高,有邊框
//?
//? //console.log(my$("dv").scrollWidth);//元素中內(nèi)容的實(shí)際的寬
//? //console.log(my$("dv").scrollHeight);//元素中內(nèi)容的實(shí)際的高
//? console.log(my$("dv").scrollTop);//向上卷曲出去的距離
//? console.log(my$("dv").scrollLeft);//向左卷曲出去的距離
//};
9. 三大系列之系列三：client系列
????* client系列:可視區(qū)域
? ? * clientWidth:可視區(qū)域的寬(沒有邊框),邊框內(nèi)部的寬度
? ? * clientHeight:可視區(qū)域的高(沒有邊框),邊框內(nèi)部的高度
? ? * clientLeft:左邊邊框的寬度
? ? * clientTop :上面的邊框的寬度
