JavaScript学习笔记整理Day15

Posted 2020-09-23

BOM浏览器对象模型

　　1.window

　　2.Location

　　3.History

　　4.Screen

　　5.Navigator

一.window

　　window概述：

　　　　1.window是客户端javascript的全局对象

　　　　2.它表示web浏览器的一个窗口或窗体，并且用标识符window来引用

　　1.innerHeight 返回窗口的文档显示区高度 IE9以下不兼容

　　2.innerWidth 返回窗口的文档显示区宽度 IE9以下不兼容

　　　　解决方法：

　　　　//获取窗口的宽高
        var width = window.innerWidth || document.documentElement.clientWidth;
        var w = window.innerWidth || document.documentElement.offsetWidth;
        console.log(width,w);


        //获取窗口的高度
        var height = window.innerHeight || document.documentElement.clientHeight;
        var h = window.innerHeight || document.documentElement.offsetHeight;
        console.log(height,h);

　　3.outerWidth 返回窗口外部宽度 IE9以下不兼容(暂无解决方法)

　　4.outerHeigh 返回窗口外部高度 IE9以下不兼容(暂无解决方法)

　　5.弹窗   alert()        

　　　　　　confirm()

　　　　　　prompt()

　　6.setInterval()   多次定时    clearInterval() 清除定时

　　7.setTimeout()  单次定时     clearTimeout()清除定时

　　8.print()  打印

　　9.scrollTo(x,y)   将内容滚动到指定坐标

　　10.scrollBy()  按照指定像素滚动 

二.location  --表示该窗口当前显示的文档的URL并定义了方法来是窗口载入新的文档

　　属性：

　　1.href 设置或返回当前的URL协议

　　2.protocol 设置或返回当前的URL的协议

　　3.host 设置或返回主机名和当前URL的端口号

　　4.hostname 设置或返回当前URL的主机号

　　5.port 设置或返回当前URL的端口号

　　6.pathname 设置或返回当前URL的路径部分

　　7.hash 设置或返回从#开始的锚

　　8.search 设置或返回从？开始的URL查询部分

　　方法：

　　　1.reload()--重新加载当前文档 location.reload();

　　　2.assign(); --加载新的文档 location.assign(“http://www.baidu.com”);

　　　3.replace(); --替换当前文档 location.replace(“http://www.baidu.com”);

三.navigator  该对象描述了浏览器厂商和版本信息（浏览器相关信息）

　　1.Navigator 是为了纪念NetSpace公司的Navigator 浏览器

　　2.appName 返回浏览器的名称 --只读

　　3.cookieEnabled 返回一个布尔值。true （cookie）可用。false 被禁用。

　　4.appVersion 返回浏览器的平台和版本信息

　　5.userAgent 返回由客户机发送服务器user-agent头部的值

　　6.platform 返回运行浏览器的操作系统平台

　　7.onLine 是否在线

四.History

　　1.back()　加载history列表中的前一个URL

　　2.forward() 加载history列表中下一个URL

　　3.go() 加载history列表中的某个具体页面 (有参数)

五.screen    提供有关窗口显示大小和可用颜色数量的信息

　　1.width 返回显示器屏幕的宽度

　　2.height 返回显示器屏幕的高度

　　3.availWidth 返回显示屏幕宽度（除windows任务栏之外）

　　4.availHeight 返回显示屏幕高度(出windows任务栏之外)

　　5.colorDepth 返回目标设备或缓冲器上的调色板的比特深度