瀏覽器物件模型 (BOM)
瀏覽器物件模型（Browser Object Model）尚無正式標準。
由於現代瀏覽器已經（幾乎）實現了 JavaScript 互動性方面的相同方法和屬性，因此常被認為是 BOM 的方法和屬性。
Window 尺寸
有三種方法能夠確定瀏覽器視窗的尺寸（瀏覽器的視口，不包括工具欄和滾動條）。
對於Internet Explorer、Chrome、Firefox、Opera 以及 Safari：
- window.innerHeight - 瀏覽器視窗的內部高度
- window.innerWidth - 瀏覽器視窗的內部寬度
對於 Internet Explorer 8、7、6、5：
- document.documentElement.clientHeight
- document.documentElement.clientWidth
或者
- document.body.clientHeight
- document.body.clientWidth
實用的 JavaScript 方案（涵蓋所有瀏覽器）：
例項
var w=window.innerWidth
|| document.documentElement.clientWidth
|| document.body.clientWidth;
var h=window.innerHeight
|| document.documentElement.clientHeight
|| document.body.clientHeight;複製程式碼其他 Window 方法
- window.open() - 開啟新視窗
- window.close() - 關閉當前視窗
- window.moveTo() - 移動當前視窗
- window.resizeTo() - 調整當前視窗的尺寸
Window Screen
一些屬性：
- screen.availWidth - 可用的螢幕寬度
- screen.availHeight - 可用的螢幕高度
JavaScript Window Location
window.location 物件用於獲得當前頁面的地址 (URL)，並把瀏覽器重定向到新的頁面。
Window Location
物件在編寫時可不使用 window 這個字首。
一些例子：
- location.hostname 返回 web 主機的域名
- location.pathname 返回當前頁面的路徑和檔名
- location.port 返回 web 主機的埠 （80 或 443）
- location.protocol 返回所使用的 web 協議（http:// 或 https://）
- location.href 屬性返回當前頁面的 URL。
Window Location Assign
location.assign() 方法載入新的文件。
Window History
- history.back() - 與在瀏覽器點選後退按鈕相同
- history.forward() - 與在瀏覽器中點選按鈕向前相同
Window Navigator
window.navigator 物件包含有關訪問者瀏覽器的資訊。
<div id="example"></div>
<script>
txt = "<p>Browser CodeName: " + navigator.appCodeName + "</p>";
txt+= "<p>Browser Name: " + navigator.appName + "</p>";
txt+= "<p>Browser Version: " + navigator.appVersion + "</p>";
txt+= "<p>Cookies Enabled: " + navigator.cookieEnabled + "</p>";
txt+= "<p>Platform: " + navigator.platform + "</p>";
txt+= "<p>User-agent header: " + navigator.userAgent + "</p>";
txt+= "<p>User-agent language: " + navigator.systemLanguage + "</p>";
document.getElementById("example").innerHTML=txt;
</script>複製程式碼JavaScript 訊息框
警告框：
alert("我是警告框！！")
alert("再次向您問好！在這裡，我們向您演示" + '\n' + "如何向警告框新增折行。")
確認框：
var r=confirm("Press a button!");
if (r==true) { alert("You pressed OK!"); }
else
{
alert("You pressed Cancel!");
}
提示框：
var name=prompt("請輸入您的名字","Bill Gates")
if (name!=null && name!="")
{
document.write("你好！" + name + " 今天過得怎麼樣？")
}
JavaScript 計時事件
JavaScript Cookies
cookie 用來識別使用者。
<html>
<head>
<script type="text/javascript">
function getCookie(c_name)
{
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())
}
function checkCookie()
{
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>複製程式碼注：
unescape
語法
unescape(string)