JS BOM操作

什麼是BOM

1. 瀏覽器對象模型
2. BOM使我們可以通過JS操作瀏覽器
3. 在BOM中爲我們提供了一組對象來完成對瀏覽器的操作
   1. window
      代表整個瀏覽器窗口，同時也是網頁中的全局對象
   2. navigator
      代表當前瀏覽器信息，通過該對象可以識別不同的瀏覽器
   3. location
      代表當前瀏覽器地址欄信息，可以獲取地址欄信息或者操作瀏覽器跳轉
   4. history
      代表瀏覽器歷史記錄，可以通過該對象來操作瀏覽器歷史記錄，由於隱私原因，該對象不能獲取到具體歷史記錄，只能操作本次訪問向前向後翻頁
   5. screen
      代表用戶的屏幕信息，通過該對象可以獲取到用戶的顯示器相關信息
4. 可以通過window對象使用，也可以直接使用

Navigator

//由於歷史原因，navigator中的大部分屬性已經不能幫助我們識別瀏覽器了
//一般用userAgent來判斷瀏覽器信息，userAgent返回一個字符串，其中包含用來描述瀏覽器信息的內容

var ua = navigator.userAgent
if(/firefox/i.test(ua)){
	alert('火狐')
}else if(/chrome/i.test(ua)){
	alert('chrome')
}else if(/msie/i.test(ua)){
	alert('ie')
	//IE11 得用這個來判斷，因爲字符串中沒有msie了
}else if('ActiveXObject' in window){
	alert('ie11')
}

History

// length 獲取當次訪問的連接數量
alert(history.length)
history.back()	//返回上一個頁面
history.forward()	//跳轉下一個頁面
history.go(-1)	//傳正負值表示跳轉到哪個頁面

Location

// location 獲取地址欄信息
alert(location)
// 爲location賦值 可以是完整地址或者相對路徑 會實現跳轉
//且會生成相應的歷史記錄
location = 'http://www.baidu.com/'
loacation = './1.html'

//assign 同樣用來跳轉到其他頁面 作用和直接修改location一樣,也會生成歷史記錄
location.assign('http://www.baidu.com/')

//replace() 使用一個新的頁面替換當前頁面，但是不會生成歷史記錄，不能使用回退按鈕
location.replace('http://www.baidu.com/')

//reload 重新加載當前頁面，作用和刷新按鈕一樣
//傳入參數true強制清空緩存刷新頁面 和 ctrl + F5 效果一樣
location.reload(true)

定時器

//setInterval()有一個返回值Number類型，這個數字用來作爲定時器唯一的標識
var count = document.getElementById('div')
var num = 1
//每點擊一次按鈕就會開起一個定時器，多次點擊後會導致定時器過快，且最後只能關閉最後一次開起的定時器
//所以開起定時器之前 需要將當前元素的定時器關閉
clearInterval(timer)
var timer = setInterval(function(){
	count.innerHTML = num++
	if(num == 11){
	//clearInterval() 用來關閉一個定時器，需要傳一個定時器的標識符
	//它可以接收任意參數，如果參數是一個有效的定時器標識，則停止對應的定時器，如果不是一個有效的標識，則什麼也不做
	clearInterval(timer)
	}
},1000)

//setTimeout()
var timer1 = setInterval(function(){
	}
},1000)
clearInterval(timer1)