javascript浏览器对象模型BOM

转载

Serena_tz 2022-11-07 17:59:14 博主文章分类：javascript

Window 对象

所有浏览器都支持 window 对象。它代表浏览器的窗口。
所有全局 JavaScript 对象，函数和变量自动成为 window 对象的成员。
全局变量是 window 对象的属性。
全局函数是 window 对象的方法。
甚至（HTML DOM 的）document 对象也是 window 对象属性：

window.document.getElementById("header");

等同于：

document.getElementById("header");

窗口尺寸

两个属性可用用于确定浏览器窗口的尺寸。
这两个属性都以像素返回尺寸：

window.innerHeight - 浏览器窗口的内高度（以像素计）
window.innerWidth - 浏览器窗口的内宽度（以像素计）

浏览器窗口（浏览器视口）不包括工具栏和滚动条。
对于 Internet Explorer 8, 7, 6, 5：

document.documentElement.clientHeight
document.documentElement.clientWidth

或

document.body.clientHeight
document.body.clientWidth

一个实用的 JavaScript 解决方案（包括所有浏览器）：
实例：

var w = window.innerWidth
|| document.documentElement.clientWidth
|| document.body.clientWidth;

var h = window.innerHeight
|| document.documentElement.clientHeight
|| document.body.clientHeight;

其他窗口方法

一些其他方法：

window.open() - 打开新窗口
window.close() - 关闭当前窗口
window.moveTo() -移动当前窗口
window.resizeTo() -重新调整当前窗口

Window Screen

window.screen 对象不带 window 前缀也可以写：

属性	描述
screen.width	返回以像素计的访问者屏幕宽度
screen.height	返回以像素计的访问者屏幕的高度
screen.availWidth	返回访问者屏幕的宽度，以像素计，减去诸如窗口工具条之类的界面特征
screen.availHeight	返回访问者屏幕的高度，以像素计，减去诸如窗口工具条之类的界面特征
screen.colorDepth	返回用于显示一种颜色的比特数，显示以位计的屏幕色彩深度
screen.pixelDepth	返回屏幕的像素深度

Window Location

window.location 对象可不带 window 前缀书写。

属性	描述
window.location.href	返回当前页面的 href (URL)
window.location.hostname	返回 web 主机的域名
window.location.pathname	返回当前页面的路径或文件名
window.location.protocol	返回使用的 web 协议（http: 或 https:）
window.location.port	返回（当前页面的）互联网主机端口的编号
window.location.assign	加载新文档
注释：如果端口号是默认值（对于 http 为 80，对于 https 为 443），则大多数浏览器将显示 0 或不显示。

Window History

window.history 对象可不带 window 书写。
为了保护用户的隐私，JavaScript 访问此对象存在限制。

方法	描述
history.back()	加载历史列表中前一个 URL，等同于在浏览器点击后退按钮
history.forward()	加载历史列表中下一个 URL，等同于在浏览器中点击前进按钮

Window Navigator

window.navigator 对象可以不带 window 前缀来写。
一些例子：

属性	描述
navigator.appName	返回浏览器的应用程序名称,“Netscape” 是 IE11、Chrome、Firefox 以及 Safari 的应用程序名称的统称
navigator.appCodeName	返回浏览器的应用程序代码名称，“Mozilla” 是 Chrome、Firefox、IE、Safari 以及 Opera 的应用程序代码名称
navigator.product	返回浏览器引擎的产品名称，大多数浏览器都将 “Gecko” 作为产品名称返回
navigator.appVersion	返回有关浏览器的版本信息
navigator.userAgent	返回由浏览器发送到服务器的用户代理报头（user-agent header）
navigator.platform	返回浏览器平台（操作系统）
navigator.language	返回浏览器语言
navigator.onLine	返回 true，假如浏览器在线
navigator.javaEnabled() 方法	返回 true，如果 Java 已启用
navigator.cookieEnabled	返回 true，如果 cookie 已启用，否则返回 false
警告！！！
来自 navigator 对象的信息通常是误导性的，不应该用于检测浏览器版本，因为：