1. 程式人生 > 其它 >js之BOM概述

js之BOM概述

參考:https://www.runoob.com/js/js-window.html

介紹

BOM,Browser Object Model瀏覽器物件模型。

現在幾乎所有瀏覽器都支援BOM,用全域性物件window表示,用於與瀏覽器進行互動。

不同標籤頁,標籤頁與頁面中iframe分別對應不同window物件。

window呼叫方法和屬性時,可以直接使用,效果相同。

window.screen

screen.availWidth
screen.availWidth
  • 獲取螢幕的可用寬度和高度

window.location

與位址列相關的讀取和設定

window.history

window.history.back()
window.history.forward()
history.go(1);
  • 相當於點選瀏覽器位址列左側的倒退和前進按鈕

window.navigator

<script>
txt = "<p>瀏覽器代號: " + navigator.appCodeName + "</p>";
txt+= "<p>瀏覽器名稱: " + navigator.appName + "</p>";
txt+= "<p>瀏覽器版本: " + navigator.appVersion + "</p>";
txt+= "<p>啟用Cookies: " + navigator.cookieEnabled + "</p>";
txt+= "<p>硬體平臺: " + navigator.platform + "</p>";
txt+= "<p>使用者代理: " + navigator.userAgent + "</p>";
txt+= "<p>使用者代理語言: " + navigator.language + "</p>";
document.getElementById("example").innerHTML=txt;
</script>

視窗

1、警告彈窗

window.alert('abc')
  • 彈窗

2、確認視窗

r = window.confirm("確定退出?");

彈窗後選擇確定,返回true,選擇取消,返回false

3、輸入對話方塊

r = window.prompt("sometext","defaultvalue");

彈窗後,第一個引數為輸入提示,第二個引數為預設值。輸入之後確定返回輸入的內容。

計時

setInterval() - 間隔指定的毫秒數不停地執行指定的程式碼。
setTimeout() - 在指定的毫秒數後執行指定程式碼。

setInterval(function(){console.log("Hello")},3000);
  • 每三秒輸出日誌
<p>在頁面顯示一個時鐘</p>
<p id="demo"></p>
<script>
var myVar=setInterval(function(){myTimer()},1000);
function myTimer(){
	var d=new Date();
	var t=d.toLocaleTimeString();
	document.getElementById("demo").innerHTML=t;
}
</script>

document

獲取到當前框架的document物件

window.console

window.console.log("123")
window.console.info("abc")

控制檯輸出

window.open

window.open("https://www.baidu.com/")

如果瀏覽器已經開啟過該頁面,該函式功能是聚焦到開啟的頁面。
如果未開啟,則在當前頁面開啟。