BOM(Browser Object Model)浏览器对象模型 BOM 使 JavaScript 有能力与浏览器“对话” BOM尚无正式标准,但是浏览器已经(几乎)实现了 JavaScript 交互性方面的相同方法和属性
window对象
-
表示浏览器窗口,所有浏览器都支持 window 对象
-
所有 JavaScript 全局对象、函数以及变量均自动成为 window 对象的成员
-
全局变量是 window 对象的属性
-
全局函数是 window 对象的方法
-
window对象是BOM模型中的顶层对象,因此所有BOM模型中的对象都是该对象的子对象
-
HTML DOM 的 document 也是 window 对象的属性之一
属性
属性名 | 说明 |
---|---|
closed | 返回一个布尔值,用于判断窗口是否已经关闭。 |
defaultStatus | 属性值为字符串,用于定义状态栏的默认文字 |
status | 属性值为字符串,可以用来改变状态栏的内容 |
window对象的所有子对象都是window对象的属性 所有的全局变量也都是 window 对象的属性
方法
弹窗方法
方法名 | 说明 |
---|---|
alert("信息内容") | 弹出一个警告框 |
confirm("信息内容") | 弹出一个确认对话框 |
prompt("信息内容",["默认输入内容"]) | 弹出一个提示对话框 |
-
如果用户点击确定按钮,则 confirm() 返回 true。如果点击取消按钮,则 confirm() 返回 false。
-
在调用 confirm() 时,将暂停对 JavaScript 代码的执行,在用户作出响应之前,不会执行下一条语句。
任务计划
方法名 | 说明 |
---|---|
setInterval("javascript语句",毫秒) | 周期性执行计时器(执行多次) |
clearInterval(计时器) | 取消计时器 |
setTimeout("javascript语句",毫秒) | 定时执行计时器(只执行一次) |
clearTimeout(计时器) | 取消计时器 |
窗口控制
方法名 | 说明 |
---|---|
open([url],[_blank],[width|height|left|top]) | 打开新页面 |
close() | 关闭当前页面 |
moveTo(x,y) | 移动窗口到指定坐标 |
moveBy(x,y) | 相对当前位置移动 |
resizeTo(x,y) | 窗口大小调整到指定宽高 |
resizeBy(+w,+h)(可以是正、负数值) | 窗口大小增减宽高 |
location对象
location 对象用于获得当前页面的地址 (URL),或把浏览器重定向到新的页面
window.location="https://www.qtummatrix.com/"
属性
属性名 | 说明 |
---|---|
pathname | 返回当前页面的路径和文件名。 |
href | 返回当前页面的 URL |
hostname | 返回域名 |
port | 返回端口 |
protocol | 返回协议 |
search | 返回传值部分 |
修改href的值
location.href="https://www.baidu.com/"
方法
方法名 | 说明 |
---|---|
reload([true|false]) | 从服务重新加载页面,true为绕过缓存,默认为false |
replace("url") | 跳转到新页面 |
多种跳转方式
location.replace("https://www.qtummatrix.com/")
window.location=''
window.open('url')
history对象
history对象是JavaScript中的一种默认对象,该对象可以用来存储客户端浏览器窗口最近浏览过的历史网址。通过History对象的方法,可以完成类似于浏览器窗口中的前进、后退等按钮的功能
属性名 | 说明 |
---|---|
length | 浏览器窗口的历史列表中的网页个数 |
方法
方法名 | 说明 |
---|---|
go(num) | 该方法可以直接跳转到某一个已经访问过的URL。 |
forward() | 该方法可以前进到下一个访问过的URL,等价于go(1) |
back() | 该方法可以返回到上一个访问过的URL,等价于go(-1) |
back()表示返回到上一页面,效果相当于go(-1); forward()表示返回到下一页面,效果相当于go(1); go()用于指定页的跳转,比如go(-2)表示返回到浏览过的前两个页面 思考: history.go(0)是什么效果
navigator对象
navigator对象,也称为浏览器对象,该对象包含了浏览器的整体信息,如浏览器名称、版本号等
属性名 | 说明 |
---|---|
appName | 返回浏览器的名称 |
appVersion | 返回浏览器的版本号 |
browserLanguage | 返回当前浏览器的语言。[不兼容] |
platform | 返回运行浏览器的操作系统或硬件平台 |
cookieEnabled | 检测浏览器是否支持Cookie。该属性值为布尔类型,如果浏览器支持Cookie则返回true,否则返回false |
screen对象
-
screen对象是一个由JavaScript自动创建的对象,该对象的作用主要是描述客户端的显示器的信息,例如屏幕的分辨率、可用颜色数等。
-
screen对象是一个全局对象,该对象中存放的都是静态属性,这些属性值是只读的
属性名 | 说明 |
---|---|
height | 屏幕的高度,单位为像素 |
width | 屏幕的宽度,单位为像素 |
colorDepth | 颜色深度 |
availHeight | 显示器可用的屏幕高度,单位为像素。(不含任务栏) |
availWidth | 显示器可用的屏幕宽度,单位为像素 |