浏览器对象模型(Browser Object Model (BOM)):允许 JavaScript 与浏览器对话。
不同的浏览器对JavaScript支持的差异主要是,有些API的接口不一样,比如AJAX,File接口。对于ES6标准,不同的浏览器对各个特性支持也不一样。在编写JavaScript的时候,就要充分考虑到浏览器的差异,尽量让同一份JavaScript代码能运行在不同的浏览器中。
浏览器提供6大对象提供JavaScript获取:window、navigator、screen、location、document、history
1. window对象:不但充当全局作用域,而且表示浏览器窗口。
所有浏览器都支持 window 对象。它代表浏览器的窗口。所有全局 JavaScript 对象,函数和变量自动成为 window 对象的成员。全局变量是 window 对象的属性;全局函数是 window 对象的方法。甚至(HTML DOM 的)document 对象也是 window 对象属性。
窗口尺寸属性:
window.innerHeight - 浏览器窗口的内高度(以像素计)window.innerWidth - 浏览器窗口的内宽度(以像素计)
窗口方法:
window.open() - 打开新窗口window.close() - 关闭当前窗口window.moveTo() -移动当前窗口window.resizeTo() -重新调整当前窗口
2.window.screen 对象:包含用户屏幕的信息。
该对象也可以不带window前缀。常用的属性:
screen.width 返回以像素计的访问者屏幕宽度screen.height 返回以像素计的访问者屏幕的高度screen.availWidth 返回访问者屏幕的宽度,以像素计,减去诸如窗口工具条之类的界面特征screen.availHeight 返回访问者屏幕的高度,以像素计,减去诸如窗口工具条之类的界面特征screen.colorDepth 返回用于显示一种颜色的比特数screen.pixelDepth 返回屏幕的像素深度,对于现代计算机,颜色深度和像素深度是相等的。
3. window.location 对象:可用于获取当前页面地址(URL)并把浏览器重定向到新页面。
window.location 对象可不带 window 前缀。常用的属性:
window.location.href 返回当前页面的 href (URL)window.location.hostname 返回 web 主机的域名window.location.pathname 返回当前页面的路径或文件名window.location.protocol 返回使用的 web 协议(http: 或 https:)window.location.port 返回(当前页面的)互联网主机端口的编号(注意:如果端口号是默认值(对于 http 为 80,对于 https 为 443),则大多数浏览器将显示 0 或不显示)window.location.assign 加载新文档
4. window.history 对象:包含浏览器历史。(注意:任何情况,你都不应该使用history这个对象了。)
window.history 对象可不带 window前缀。JavaScript可以调用history对象的back()或forward (),相当于用户点击了浏览器的“后退”或“前进”按钮。
5. window.navigator 对象:表示浏览器的信息。
window.navigator 对象可以不带 window 前缀。常用的属性:
navigator.appName:浏览器名称;注意:"Netscape" 是 IE11、Chrome、Firefox 以及 Safari 的应用程序名称的统称。navigator.appVersion:浏览器版本;navigator.appCodeName:返回浏览器的应用程序代码名称navigator.language:浏览器设置的语言;navigator.platform:操作系统类型;navigator.userAgent:浏览器设定的User-Agent字符串。navigator.cookieEnabled: 返回 true,如果 cookie 已启用,否则返回 false。navigator.product:返回浏览器引擎的产品名称navigator.platform:返回浏览器平台(操作系统)navigator.onLine: 属性返回 true,假如浏览器在线navigator.javaEnabled():方法返回 true,如果 Java 已启用
来自 navigator 对象的信息通常是误导性的,不应该用于检测浏览器版本,因为:
不同浏览器能够使用相同名称导航数据可被浏览器拥有者更改某些浏览器会错误标识自身以绕过站点测试浏览器无法报告发布晚于浏览器的新操作系统
6. window.document对象:表示当前页面。由于HTML在浏览器中以DOM形式表示为树形结构,document对象就是整个DOM树的根节点。
window.document 对象可以不带 window 前缀。常用的方法和属性
document.cookie:属性返回读取到当前页面的Cookie
Cookie是由服务器发送的key-value标示符。因为HTTP协议是无状态的,但是服务器要区分到底是哪个用户发过来的请求,就可以用Cookie来区分。当一个用户成功登录后,服务器发送一个Cookie给浏览器,例如user=ABC123XYZ(加密的字符串)...,此后,浏览器访问该网站时,会在请求头附上这个Cookie,服务器根据Cookie即可区分出用户。
Cookie还可以存储网站的一些设置,例如,页面显示的语言等等。
由于JavaScript能读取到页面的Cookie,而用户的登录信息通常也存在Cookie中,这就造成了巨大的安全隐患,这是因为在HTML页面中引入第三方的JavaScript代码是允许的;如果引入的第三方的JavaScript中存在恶意代码,则www.foo.com网站将直接获取到www.example.com网站的用户登录信息。
httpOnly:设定了httpOnly的Cookie将不能被JavaScript读取。这个行为由浏览器实现,主流浏览器均支持httpOnly选项,IE从IE6 SP1开始支持。为了确保安全,服务器端在设置Cookie时,应该始终坚持使用httpOnly。