本文實例講述了JavaScript 瀏覽器對象模型BOM原理與常見用法。分享給大家供大家參考，具體如下：
什么是BOM
BOM：Browser Object Model，瀏覽器對象模型
從上圖也可以看出：
window對象：
彈出系統對話框
比如說，alert(1)是window.alert(1)的簡寫，因為它是window的子方法。
系統對話框有三種：
alert(); //不同瀏覽器中的外觀是不一樣的 confirm(); //兼容不好 prompt(); //不推薦使用
打開窗口、關閉窗口
打開窗口
window.open(url,target)
參數解釋：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<!--行間的js中的open() window不能省略-->
<button onclick="window.open('https://www.luffycity.com/')">路飛學城</button>
<button>打開百度</button>
<button onclick="window.close()">關閉</button>
<button>關閉</button>
</body>
<script type="text/javascript">
var oBtn = document.getElementsByTagName('button')[1];
var closeBtn = document.getElementsByTagName('button')[3];
oBtn.onclick = function(){
//open('https://www.baidu.com')
//打開空白頁面
open('about:blank',"_self")
}
closeBtn.onclick = function(){
if(confirm("是否關閉？")){
close();
}
}
</script>
</html>
<body>
<!--BOM使用的是window.開頭的語句-->
<!--history模式和 hash模式-->
<!--history模式： xxxx/#/index.html-->
<!--hash模式：xxxx/index.html-->
<button id="btn">跳轉</button>
<script>
var oBtn=document.getElementById('btn');
oBtn.onclick=function(){
console.log(location);
//打開百度，下面三種方式皆可
// location.;
// open('http://www.baidu.com','_self');
window.open('http://www.baidu.com','_self');//在當前頁面打開
window.location.reload();//刷新或者叫重載
}
</script>
</body>
location對象
window.location可以簡寫成location。location相當于瀏覽器地址欄，可以將url解析成獨立的片段。
location對象的屬性
舉例：5秒后自動跳轉到百度。
有時候，當我們訪問一個不存在的網頁時，會提示5秒后自動跳轉到指定頁面，此時就可以用到location
<script>
setTimeout(function () {
location.;
}, 5000);
</script>
location.reload():重新加載,這個加載是 全局刷新，讓整個文檔重新解析了一遍，一般不建議使用
setTimeout(function(){
//3秒之后讓網頁整個刷新
window.location.reload();
},3000)
navigator對象
window.navigator 的一些屬性可以獲取客戶端的一些信息。
console.log(navigator.userAgent); console.log(navigator.platform);
感興趣的朋友可以使用在線HTML/CSS/JavaScript代碼運行工具：http://tools.jb51.net/code/HtmlJsRun測試上述代碼運行效果。
更多關于JavaScript相關內容感興趣的讀者可查看本站專題：《JavaScript操作DOM技巧總結》、《JavaScript頁面元素操作技巧總結》、《JavaScript事件相關操作與技巧大全》、《JavaScript查找算法技巧總結》、《JavaScript數據結構與算法技巧總結》、《JavaScript遍歷算法與技巧總結》及《JavaScript錯誤與調試技巧總結》
希望本文所述對大家JavaScript程序設計有所幫助。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
