BOM对象
ECMAScript + BOM + DOM BOM(Browser Object Model)浏览器对象模型 BOM 使 JavaScript 有能力与浏览器“对话” BOM尚无正式标准,但是浏览器已经(几乎)实现了 JavaScript 交互性方面的相同方法和属性(window)
window对象
- 表示浏览器窗口,所有浏览器都支持 window 对象
- 所有 JavaScript 全局对象、函数以及变量均自动成为 window 对象的成员
- 全局变量是 window 对象的属性
- 全局函数是 window 对象的方法
- window对象是BOM模型中的顶层对象,因此所有BOM模型中的对象都是该对象的子对象
- HTML DOM 的 document 也是 window 对象的属性之一
子对象 作用 document 文档对象用于操作页面元素 location 地址对象用于操作URL地址 navigator 浏览器对象用于获取浏览器版本信息 history 历史对象用于操作浏览器历史 screen 屏幕对象用于操作屏幕的高度和宽度
属性
****属性名 ****说明 closed 返回一个布尔值,用于判断窗口是否已经关闭。
window对象的所有子对象都是window对象的属性 所有的全局变量也都是 window 对象的属性
方法
****方法名 ****说明 open([url],[_blank],[width|height|left|top]) 打开新页面 close() 关闭当前页面 moveTo(x,y) 移动窗口到指定坐标 moveBy(x,y) 相对当前位置移动 resizeTo(x,y) 窗口大小调整到指定宽高 resizeBy(+w,+h)(可以是正、负数值) 窗口大小增减宽高
注意:在使用moveTo,moveBy,resizeTo,resezeBy的时候,打开的窗口必须是自己的窗口,不能使用百度等在线的地址,会出现跨域的错误
弹窗方法:
****方法名 ****说明 alert("信息内容") 弹出一个警告框 confirm("信息内容") 弹出一个确认对话框 prompt("信息内容",["默认输入内容"]) 弹出一个提示对话框
- 如果用户点击确定按钮,则 confirm() 返回 true。如果点击取消按钮,则 confirm() 返回 false。
- 在调用 confirm() 时,将暂停对 JavaScript 代码的执行,在用户作出响应之前,不会执行下一条语句。
任务计划
****方法名 ****说明 setInterval("javascript语句",毫秒) 周期性执行计时器(执行多次) clearInterval(计时器) 取消计时器 setTimeout("javascript语句",毫秒) 定时执行计时器(只执行一次) clearTimeout(计时器) 取消计时器
// 只执行一下 setTimeout(function(){ alert('欢迎光临'); },1000); // 周期性定时器 setInterval(function(){ alert('hello world'); }, 1000);
一般情况下,打开网页的时候弹出的广告就使用setTimeout,因为只要打开页面,就需要弹出广告,并且只弹出一次
location对象
属性
****属性名 ****说明 pathname 返回当前页面的路径和文件名。 href 返回当前页面的 URL hostname 返回域名 port 返回端口 protocol 返回协议 search 返回传值部分
location.href="https://www.baidu.com/"
方法
****方法名 ****说明 reload([true|false]) 从服务重新加载页面,true为绕过缓存,默认为false replace("url") 跳转到新页面
多种跳转方式
location.replace("https://www.qtummatrix.com/") window.location='' window.location.href='' 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 userAgent 一个只读的字符串,获取浏览器用于 HTTP 请求的用户代理头的值
screen对象
- screen对象是一个由JavaScript自动创建的对象,该对象的作用主要是描述客户端的显示器的信息,例如屏幕的分辨率、可用颜色数等。
- screen对象是一个全局对象,该对象中存放的都是静态属性,这些属性值是只读的
****属性名 ****说明 height 屏幕的高度,单位为像素 width 屏幕的宽度,单位为像素 colorDepth 颜色深度 availHeight 显示器可用的屏幕高度,单位为像素。(不含任务栏) availWidth 显示器可用的屏幕宽度,单位为像素