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/")

如果浏览器已经打开过该页面，该函数功能是聚焦到打开的页面。
如果未打开，则在当前页面打开。