javascript浏览器对象模型BOM

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 对象的信息通常是误导性的,不应该用于检测浏览器版本,因为:
  1. 不同浏览器能够使用相同名称
  2. 导航数据可被浏览器拥有者更改
  3. 某些浏览器会错误标识自身以绕过站点测试
  4. 浏览器无法报告发布晚于浏览器的新操作系统
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值