JS Window瀏覽器物件模型
阿新 • • 發佈：2018-12-15
瀏覽器物件模型 (BOM) 使 JavaScript 有能力與瀏覽器“對話”
Window物件
所有瀏覽器都支援Window物件，它表示瀏覽器視窗
所有 JavaScript 全域性物件、函式以及變數均自動成為 window 物件的成員。
全域性變數是 window 物件的屬性。
全域性函式是 window 物件的方法。
甚至 HTML DOM 的 document 也是 window 物件的屬性之一：
Window Screen（包含有關使用者螢幕的資訊）
屬性
screen.availHeight
可用螢幕高度
screen.availWidth
可用寬度
Window Location
用於獲取當前頁面的地址，並將瀏覽器重新定向到新的頁面
Window Location Href
返回當前頁面的URL
document.write(location.href);
Window Location Pathname
返回URL的路徑名
Window Location Assign
重新載入新文件
<body> <script> function doc() { window.location.assign("http://www.w3school.com.cn") } </script> <input type="button" value="載入新文件"onclick="doc()" /> </body>
JS window History
瀏覽器歷史
window.history.back()返回上一級
window.hiwtory.forwar()下一級
JS navigator
包含瀏覽者的資訊警告：來自 navigator 物件的資訊具有誤導性，不應該被用於檢測瀏覽器版本，這是因為：
navigator 資料可被瀏覽器使用者更改
瀏覽器無法報告晚於瀏覽器釋出的新作業系統
JS訊息框
1.警告框
alert(" “);
2.確認框
confirm(” ");
3.提示框
提示框經常用於提示使用者在進入頁面前輸入某個值。
當提示框出現後，使用者需要輸入某個值，然後點選確認或取消按鈕才能繼續操縱。
如果使用者點選確認，那麼返回值為輸入的值。如果使用者點選取消，那麼返回值為 null
prompt(“文字”,“預設值”);
JS計時器
1.setTimeout()
未來某時的執行程式碼
語法: var t=setTimeout(“JS語句”,時間)
clearsetTimeout()
取消setTimeout
Cookie
識別使用者
cookie 是儲存於訪問者的計算機中的變數。每當同一臺計算機通過瀏覽器請求某個頁面時，就會發送這個 cookie。你可以使用 JavaScript 來建立和取回 cookie 的值。
建立和儲存 cookie
在這個例子中我們要建立一個儲存訪問者名字的 cookie。當訪問者首次訪問網站時，他們會被要求填寫姓名。名字會儲存於 cookie 中。當訪問者再次訪問網站時，他們就會收到歡迎詞。
<!DOCTYPE html>
<html>
<head>
<script>
function getCookie(c_name) //上面的函式首先會檢查 document.cookie 物件中是否存有 cookie。假如 document.cookie 物件存有某些 cookie，那麼會繼續檢查我們指定的 cookie 是否已儲存。如果找到了我們要的 cookie，就返回值，否則返回空字串{
if (document.cookie.length > 0) {
c_start = document.cookie.indexOf(c_name + "=")
if (c_start != -1) {
c_start = c_start + c_name.length + 1
c_end = document.cookie.indexOf(";", c_start)
if (c_end == -1) c_end = document.cookie.length
return unescape(document.cookie.substring(c_start, c_end))
}
}
return ""
}
function setCookie(c_name//名稱, value//值, expiredays//過期時間) {
var exdate = new Date()
exdate.setDate(exdate.getDate() + expiredays)//記錄過期時間
document.cookie = c_name + "=" + escape(value) +
((expiredays == null) ? "" : ";expires=" + exdate.toGMTString())//判斷expiredays==null，為真，則表示式的值為空；為假則表示式的值為
";expires="+exdate.toGMTString()，
}
////上面這個函式中的引數存有 cookie 的名稱、值以及過期天數。
在上面的函式中，我們首先將天數轉換為有效的日期，然後，我們將 cookie 名稱、值及其過期日期存入 document.cookie 物件。
function checkCookie() //如果 cookie 已設定，則顯示歡迎詞，否則顯示提示框來要求使用者輸入名字。{
username = getCookie('username')
if (username != null && username != "")
{ alert('Welcome again ' + username + '!') }
else
{
username = prompt('Please enter your name:', "")
if (username != null && username != "") {
setCookie('username', username, 365)
}
}
}
</script>
</head>
<body onLoad="checkCookie()">
</body>
</html>