HTML BOM Browser对象

时间  2019-11-24
标签 html bom browser 对象 栏目 HTML 繁體版
原文   原文链接

本文转载自：http://www.cnblogs.com/polk6/p/5045277.htmlhtml

HTML BOM Browser对象

BOM：Browser Object Model，即浏览器对象模型，提供了独立于内容的、能够与浏览器窗口进行互动的对象结构。java

Browser对象：指BOM提供的多个对象，包括：Window、Navigator、Screen、History、Location等。web

其中Window对象为顶层对象，其余对象都为Window对象的子对象。数组

 

目录

1. Window 对象：表示浏览器打开的窗口，包括获取焦点、改变滚动条、设置定时器等等。浏览器

2. Navigator 对象：包含浏览器信息。如：获取浏览器名称、版本信息、操做系统平台信息等等。缓存

3. Screen 对象：包含屏幕信息。如：获取屏幕高度、宽度等等。服务器

4. History 对象：可对当前页的浏览历史进行操做，如：前进、后退等。网络

5. Location 对象：可对当前页面的URL进行操做，如：导航到新的页面、获取URL信息等。session

 

1. Window 对象

1.1 说明

Window 对象：表示浏览器打开的窗口、标签或者框架(若当前页面里包含多个iframe，会为每一个iframe建立Window对象)。app

Window对象不会被实例化，调用属性和方法都做为window的静态成员。

调用方式：调用Window对象的成员时，能够省略前面的window。如：window.alert() 可写成 alert() 。

 

1.2 属性

属性 readonly ApplicationCache applicationCache ：返回窗口的应用缓存对象。

属性 readonly boolean closed ：返回窗口是否已经关闭。

属性 readonly Console console ：返回对Consol对象的引用，对浏览器控制台进行操做。

属性 readonly int devicePixelRatio ：返回设备像素比，即当前显示器的物理像素和设备独立像素(dip)的比例。

属性 readonly Document document ：返回当前窗口的Document对象。

属性 readonly Element frameElement ：若当前window处于一个<iframe>中，此属性返回这个IFrame。若在顶级窗口，返回null。

属性 readonly Window[] frames ：返回一个包含窗口内全部的框架的数组。

属性 readonly History history ：返回一个History对象。可对当前页的历史进行操做，如：前进、后退等。

属性 readonly long innerHeight ：返回当前窗口可显示HTML文档的高度，单位px(像素)。

属性 readonly long innerWidth ：返回当前窗口可显示HTML文档的宽度，单位px(像素)。

属性 readonly long length ：返回窗口内包含框架的数量，即frames数量。

属性 readonly Location location ：返回一个Location对象。可对当前页面的URL进行操做，如：导航到新的页面、获取URL信息等。

属性 readonly LocalStorage localStorage ：返回一个键/值对存储的Storage对象，持续到被用户删除。

属性 string name ：设置或获取当前窗口的name。

属性 readonly Navigator navigator ：返回一个Navigator 对象。包含浏览器信息。如：获取浏览器名称、版本信息、操做系统平台信息等等。

属性 Window openner ：返回对打开当前窗口的原窗口一个引用。若当前窗口是由另外一个窗口打开的, window.opener保留对那个窗口的引用. 若是当前窗口不是由其余窗口打开的，则该属性返回 null。

属性 readonly long outerHeight ：返回当前浏览器的总高度，单位px(像素)。包含工具栏、滚动条、浏览器边框等范围。

属性 readonly long outerWidth ：返回当前浏览器的总宽度，单位px(像素)。包含工具栏、滚动条、浏览器边框等范围。

属性 readonly long pageXOffset ：返回文档横向滚动的距离，单位px(像素)。

属性 readonly long pageYOffset ：返回文档纵向滚动的距离，单位px(像素)。

属性 readonly Window parent ：返回当前窗口的父级窗口。若当前窗口是顶级窗口，返回当前窗口自己。若当前窗口为一个框架窗口，返回它的父窗口。

属性 readonly Screen screen ：返回一个Screen对象。包含屏幕信息。如：获取屏幕高度、宽度等等。

属性 readonly long screenX ：返回浏览器在屏幕的X坐标。

属性 readonly long screenY ：返回浏览器在屏幕的Y坐标。

属性 readonly long scrollX ：返回文档横向滚动的距离，单位px(像素)。与pageXOffset属性同样。

属性 readonly long scrollY ：返回文档纵向滚动的距离，单位px(像素)。与pageYOffset属性同样。

属性 readonly Window self ：返回一个对当前Window对象的引用。

属性 readonly SessionStorage sessionStorage ：返回一个键/值对存储的Storage对象，持续到当前浏览会话结束。

属性 readonly Window top ：返回当前窗口的顶级窗口。若当前窗口自己已是顶级，则返回自身。若当前窗口为一个框架窗口，返回包含它的顶级窗口(parent只是返回父窗口)。

属性 readonly Window window ：返回当前窗口Window对象。

 

1.3 方法

方法 void addEventListener(string eventType,function eventListener) ：给窗口注册事件。eventType事件类型，如：click。eventListener：事件触发的函数或对象。

方法 void alert(string msg) ：弹出一个包含msg和一个确认按钮的警告框。

方法 string atob(string base64Str) ：将一个基于Base64编码的字符串解码为一个字符串。

方法 void blur() ：当前窗口移除焦点。

方法 string btoa(string str) ：将一个字符串编码为一个Base64编码。

方法 void clearInterval(long intervalHandle) ：中止intervalHandle指定的setInterval()。

方法 void clearTimeout(long timeoutHandle) ：中止timeoutHandle指定的setTimeout()。

方法 void close() ：关闭当前窗口。只能关闭由脚本打开的窗口，如：a元素打开新页面。

方法 boolean confirm(string msg) ：显示带有一段消息以及确认按钮和取消按钮的对话框。点击确认按钮返回true，点击取消按钮返回false。

方法 void focus() ：当前窗口得到焦点。

方法 void moveBy(long deltaX, long deltaY) ：使open()方法建立的窗口，在自己的位置上，水平移动deltaX个像素，垂直移动deltaY个像素。

方法 void moveTo(long x, long y) ：使open()方法建立的窗口，移动到x，y坐标。

方法 Window open(string url, string target, string features, string replace) ：建立一个新的窗口。

  方法详情

方法 void print() ：调用浏览器的打印按钮。

方法 string prompt(string msg) ：弹出一个显示msg信息并包含一个肯定按钮和取消按钮的输入框。此输入框会阻塞页面，点击肯定按钮返回输入的内容，点击取消按钮返回null。

方法 void resizeBy(long deltaWidth, long deltaHeight) ：使open()方法建立的窗口，在自己的位置上，宽度增长deltaWidth个像素，高度增长deltaHeight个像素。

方法 void resizeTo(long width, long height) ：使open()方法建立的窗口，宽度变为width，高度变为height。

方法 void scrollBy(long deltaWidth, long deltaHeight) ：在当前滚动的基础上，横向滚动deltaWidth像素，纵向滚动deltaHeight像素。

方法 void scrollTo(long width, long height) ：横向滚动到width像素距离上，纵向滚动到height像素距离上。

方法 long setInterval(function fn, long time) ：每隔必定的周期(毫秒)执行指定函数。

  方法详情

方法 long setTimeout(function fn, long time) ：在必定的毫秒数后执行指点函数。

  方法详情

 

2.Navigator 对象

2.1 说明

Navigator 对象：包含浏览器信息。如：获取浏览器名称、版本信息、操做系统平台信息等等。

调用方式：window.navigator 或者 navigator。

 

2.2 属性

属性 readonly string appName ：返回浏览器的名称。基于 Netscape 的浏览器中，返回的是 "Netscape"。在 IE 中，返回值为 "Microsoft Internet Explorer"。

属性 readonly string appVersion ：返回浏览器版本和平台信息。如：某个Chrome版本返回 "5.0 (Windows NT 6.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/43.0.2357.134 Safari/537.36"。

属性 readonly Geolocation geolocation ：返回一个Geolocation对象，可获取当前的地理信息。

属性 readonly string language ：返回浏览器界面语言。简体中文返回："zh-CN"。

属性 readonly boolean onLine ：返回浏览器是否可链接网络。

属性 readonly string platform ：返回浏览器所在的系统平台。如：Win32。

属性 readonly string userAgent ：返回由客户机发送服务器的 user-agent 头部的值。如："Mozilla/5.0 (Windows NT 6.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/43.0.2357.134 Safari/537.36".

属性 readonly ServiceWorker serviceWorker ：返回ServiceWorker对象。serviceWorker运行于浏览器后台的一种脚本，它能够无需Web页面或者用户交互就能提供额外的功能。

 

2.2 方法 

方法 boolean javaEnabled() ：返回浏览器是否启用Java。

 

3. Screen 对象

3.1 介绍

Screen 对象：包含屏幕信息。如：获取屏幕高度、宽度等等。

调用方式：window.screen 或者 screen。

 

3.2 属性

属性 readonly long availHeight ：返回浏览器在屏幕的可用高度，单位px(像素)。可理解为浏览器最大化的高度，通常为屏幕高度减去上下系统任务栏或停靠栏。

属性 readonly long availWidth ：返回浏览器在屏幕的可用宽度，单位px(像素)。可理解为浏览器最大化的宽度，通常为屏幕宽度减去左右系统任务栏或停靠栏。

属性 readonly long colorDepth ：返回屏幕的颜色深度。颜色深度简单说就是最多支持多少种颜色,。通常是用“位”来描述的。好比BMP格式，则最多能够支持红、绿、蓝各256种，总共24位。因此颜色深度是24。

属性 readonly long height ：返回屏幕的高度，单位px(像素)。

属性 readonly long pixelDepth ：返回屏幕的色彩深度。

  属性详解

属性 readonly long width ：返回屏幕的宽度，单位px(像素)。

 

4. History 对象

4.1 说明

History 对象：可对当前页的浏览历史进行操做，如：前进、后退等。但不能知道浏览了哪些URL。

调用方式：window.history 或者 history。

 

4.2 属性

属性 readonly long length ：返回浏览器历史列表中的 URL 数量。

 

4.3 方法

方法 void back() ：当前所属窗口访问上一个访问过的URL。等同于浏览器的"后退"按钮，也等同于history.go(-1)。

方法 void forward() ：当前所属窗口访问下一个访问过的URL。等同于浏览器的"前进"按钮，也等同于history.go(1)。

方法 void go(int index) ：使当前窗口访问指定的访问过的URL。当前窗口访问过的URL，是存入一个数组。正数表示前进index个(点击"前进"按钮index次)，负数表示后退index个(点击"后退"按钮index次)。

 

5. Location 对象

5.1 说明

Location 对象：可对当前页面的URL进行操做，如：导航到新的页面、获取URL信息等。

调用方式：window.location 或者 location。

 

5.2 属性

属性 string hash ：设置或返回当前页面URL中的的锚部分，包含开头的#符号。

  属性详解

属性 string host ：设置或返回当前页面URL的主机名称和端口。

  属性详解

属性 string hostname ：设置或返回当前页面URL的主机名称。

  属性详解

属性 string href ：设置或返回当前页面完整的URL。若设置时不加协议，设置的字符串只是改变URL最后一个'/'以后的字符串。

  属性详解

属性 string pathname ：设置或返回当前页面URL的路径部分。

  属性详解

属性 string port ：设置或返回当前页面URL的端口。若当前URL没有端口，返回一个''(空字符串)。

属性 string protocol ：设置或返回当前页面URL的协议，最后面会有个':'冒号。

  属性详解

属性 string search ：设置或返回当前页面URL的查询部分(从问号 (?) 开始的 URL)。

  属性详解

属性 readonly string origin ：返回当前页面URL的源。返回格式：协议+主机名+端口；如：https://www.baidu.com

 

5.3 方法

方法 void assign(string url) ：设置当前页面加载指定的url，等同于设置href属性的值为url。

方法 void reload() ：从新加载当前页面的URL。可当作为刷新操做。

方法 void replace(string url) ：设置当前页面加载指定的url，并在浏览器历史记录中替换掉当前地址，进行"后退"操做不会显示当前访问过的记录。

  方法详解

简单总结-BOM

1.什么是bom？

全称：浏览器对象模型（Browser Object Model）

bom是js的一部分，

实际上，一个完整的 JavaScript 实现是由如下 3 个不一样部分组成的：

BOM提供了不少对象，用于访问浏览器的功能，这些功能与任何网页内容无关。多年来，缺乏事实上的规范致使BOM及有意思又有问题，由于浏览器提供商会按照各自的想法随意去扩展它。因而，浏览器之间公有的对象就成为了事实上的标准。这些对象在浏览器中得以存在，很大程度上是因为它们提供了与浏览器的互操做性。W3C为了把浏览器中JavaScript最基本的部分标准化，已经将BOM的主要方面乃如了HTML5的规范中。

2.bom的对象，方法和方法

bom提供了主要的8大对象：Window，Screen，Loacation，History，Navigator；Screen，Loacation，History，Navigator四大类是Window的成员，所以均可以经过Window.*去访问。

1.Window

1.What?

Window对象：表示浏览器打开的窗口、标签或者框架(若当前页面里包含多个iframe，会为每一个iframe建立Window对象)。

Window对象不会被实例化，调用属性和方法都做为window的静态成员。

全局变量是 window 对象的属性。

全局函数是 window 对象的方法。

2.How?

调用方式：调用Window对象的成员时，能够省略前面的window。如：window.alert() 可写成 alert() 。

3.Attribute

 readonly ApplicationCache applicationCache ：返回窗口的应用缓存对象。

 readonly boolean  closed ：返回窗口是否已经关闭。

 readonly Console console ：返回对Consol对象的引用，对浏览器控制台进行操做。

 readonly int  devicePixelRatio ：返回设备像素比，即当前显示器的物理像素和设备独立像素(dip)的比例。

 readonly Document document ：返回当前窗口的Document对象。

 readonly Element frameElement ：若当前window处于一个<iframe>中，此属性返回这个IFrame。若在顶级窗口，返回null。

 readonly Window [] frames ：返回一个包含窗口内全部的框架的数组。

 readonly History history ：返回一个History对象。可对当前页的历史进行操做，如：前进、后退等。

 readonly long innerHeight ：返回当前窗口可显示HTML文档的高度，单位px(像素)。

 readonly long innerWidth ：返回当前窗口可显示HTML文档的宽度，单位px(像素)。

 readonly long  length ：返回窗口内包含框架的数量，即frames数量。

 readonlyLocation location ：返回一个Location对象。可对当前页面的URL进行操做，如：导航到新的页面、获取URL信息等。

 readonly LocalStorage localStorage ：返回一个键/值对存储的Storage对象，持续到被用户删除。

 string name ：设置或获取当前窗口的name。

 readonlyNavigator navigator ：返回一个Navigator 对象。包含浏览器信息。如：获取浏览器名称、版本信息、操做系统平台信息等等。

 Window openner ：返回对打开当前窗口的原窗口一个引用。若当前窗口是由另外一个窗口打开的, window.opener保留对那个窗口的引用. 若是当前窗口不是由其余窗口打开的，则该属性返回 null。

 readonly long outerHeight ：返回当前浏览器的总高度，单位px(像素)。包含工具栏、滚动条、浏览器边框等范围。

 readonly long  outerWidth ：返回当前浏览器的总宽度，单位px(像素)。包含工具栏、滚动条、浏览器边框等范围。

 readonly long  pageXOffset ：返回文档横向滚动的距离，单位px(像素)。

 readonly long  pageYOffset ：返回文档纵向滚动的距离，单位px(像素)。

 readonly Window parent ：返回当前窗口的父级窗口。若当前窗口是顶级窗口，返回当前窗口自己。若当前窗口为一个框架窗口，返回它的父窗口。

 readonlyScreen screen ：返回一个Screen对象。包含屏幕信息。如：获取屏幕高度、宽度等等。

 readonly long  screenX ：返回浏览器在屏幕的X坐标。

 readonly long screenY ：返回浏览器在屏幕的Y坐标。

 readonly long scrollX  ：返回文档横向滚动的距离，单位px(像素)。与pageXOffset属性同样。

 readonly long scrollY  ：返回文档纵向滚动的距离，单位px(像素)。与pageYOffset属性同样。

 readonly Window self ：返回一个对当前Window对象的引用。

 readonly SessionStorage sessionStorage ：返回一个键/值对存储的Storage对象，持续到当前浏览会话结束。

 readonly Window top ：返回当前窗口的顶级窗口。若当前窗口自己已是顶级，则返回自身。若当前窗口为一个框架窗口，返回包含它的顶级窗口(parent只是返回父窗口)。

 readonly Window window ：返回当前窗口Window对象。

2.Method

 void  addEventListener (string eventType,function eventListener) ：给窗口注册事件。eventType事件类型，如：click。eventListener：事件触发的函数或对象。

 void alert (string msg) ：弹出一个包含msg和一个确认按钮的警告框。

 string atob (string base64Str) ：将一个基于Base64编码的字符串解码为一个字符串。

 void blur () ：当前窗口移除焦点。

 string btoa (string str) ：将一个字符串编码为一个Base64编码。

 void clearInterval (long intervalHandle) ：中止intervalHandle指定的setInterval()。

 void clearTimeout (long timeoutHandle) ：中止timeoutHandle指定的setTimeout()。

 void close () ：关闭当前窗口。只能关闭由脚本打开的窗口，如：a元素打开新页面。

 boolean confirm (string msg) ：显示带有一段消息以及确认按钮和取消按钮的对话框。点击确认按钮返回true，点击取消按钮返回false。

 void  focus () ：当前窗口得到焦点。

 void  moveBy (long deltaX, long deltaY) ：使open()方法建立的窗口，在自己的位置上，水平移动deltaX个像素，垂直移动deltaY个像素。

 void  moveTo (long x, long y) ：使open()方法建立的窗口，移动到x，y坐标。

 Window open (string url, string target, string features, string replace) ：建立一个新的窗口。

 

 void  print () ：调用浏览器的打印按钮。

 string prompt (string msg) ：弹出一个显示msg信息并包含一个肯定按钮和取消按钮的输入框。此输入框会阻塞页面，点击肯定按钮返回输入的内容，点击取消按钮返回null。

 void resizeBy (long deltaWidth, long deltaHeight) ：使open()方法建立的窗口，在自己的位置上，宽度增长deltaWidth个像素，高度增长deltaHeight个像素。

 void resizeTo (long width, long height) ：使open()方法建立的窗口，宽度变为width，高度变为height。

 void scrollBy (long deltaWidth, long deltaHeight) ：在当前滚动的基础上，横向滚动deltaWidth像素，纵向滚动deltaHeight像素。

 void scrollTo (long width, long height) ：横向滚动到width像素距离上，纵向滚动到height像素距离上。

 long  setInterval (function fn, long time) ：每隔必定的周期(毫秒)执行指定函数。

 long setTimeout (function fn, long time) ：在必定的毫秒数后执行指点函数。

2.Screen

1.What?

window.screen 对象包含有关用户屏幕的信息,如一些属性：

  • screen.availWidth - 可用的屏幕宽度
  • screen.availHeight - 可用的屏幕高度

 

2.how?

window.screen 对象在编写时能够不使用 window 这个前缀。

调用方式：window.screen 或者 screen。

3.Attribute

 readonly long  availHeight ：返回浏览器在屏幕的可用高度，单位px(像素)。可理解为浏览器最大化的高度，通常为屏幕高度减去上下系统任务栏或停靠栏。

 readonly long availWidth ：返回浏览器在屏幕的可用宽度，单位px(像素)。可理解为浏览器最大化的宽度，通常为屏幕宽度减去左右系统任务栏或停靠栏。

 readonly long  colorDepth ：返回屏幕的颜色深度。颜色深度简单说就是最多支持多少种颜色,。通常是用“位”来描述的。好比BMP格式，则最多能够支持红、绿、蓝各256种，总共24位。因此颜色深度是24。

 readonly long  height ：返回屏幕的高度，单位px(像素)。

 readonly long  pixelDepth ：返回屏幕的色彩深度。

 readonly long  width ：返回屏幕的宽度，单位px(像素)。

3.Navigator

1.What?

Navigator 对象包含有关浏览器的信息。如：获取浏览器名称、版本信息、操做系统平台信息等等。

2.How?

调用方式：window.navigator 或者 navigator。

3.Attribute

 readonly string appName ：返回浏览器的名称。基于 Netscape 的浏览器中，返回的是 "Netscape"。在 IE 中，返回值为 "Microsoft Internet Explorer"。

 readonly string  appVersion ：返回浏览器版本和平台信息。如：某个Chrome版本返回 "5.0 (Windows NT 6.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/43.0.2357.134 Safari/537.36"。

 readonly  Geolocation geolocation ：返回一个Geolocation对象，可获取当前的地理信息。

 readonly string language ：返回浏览器界面语言。简体中文返回："zh-CN"。

 readonly boolean onLine ：返回浏览器是否可链接网络。

 readonly string  platform ：返回浏览器所在的系统平台。如：Win32。

 readonly string userAgent ：返回由客户机发送服务器的 user-agent 头部的值。如："Mozilla/5.0 (Windows NT 6.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/43.0.2357.134 Safari/537.36".

 readonly  ServiceWorker serviceWorker ：返回ServiceWorker对象。serviceWorker运行于浏览器后台的一种脚本，它能够无需Web页面或者用户交互就能提供额外的功能。

4.Method

 boolean  javaEnabled () ：返回浏览器是否启用Java。

4.History

1.What?

window.history 对象包含浏览器的历史。

window.history 对象在编写时可不使用 window 这个前缀。

为了保护用户隐私，对 JavaScript 访问该对象的方法作出了限制。

可对当前页的浏览历史进行操做，如：前进、后退等。但不能知道浏览了哪些URL。

2.How?

调用方式：window.history 或者 history。

3.Attribute

 readonly long length ：返回浏览器历史列表中的 URL 数量。

4.Method

 void back () ：当前所属窗口访问上一个访问过的URL。等同于浏览器的"后退"按钮，也等同于history.go(-1)。

 void  forward () ：当前所属窗口访问下一个访问过的URL。等同于浏览器的"前进"按钮，也等同于history.go(1)。

 void  go (int index) ：使当前窗口访问指定的访问过的URL。当前窗口访问过的URL，是存入一个数组。正数表示前进index个(点击"前进"按钮index次)，负数表示后退index个(点击"后退"按钮index次)。

5.Location

1.What?

window.location 对象用于得到当前页面的地址 (URL)，并把浏览器重定向到新的页面。

window.location 对象在编写时可不使用 window 这个前缀。

2.How?

调用方式：window.location 或者 location。

3.Attribute

 string hash ：设置或返回当前页面URL中的的锚部分，包含开头的#符号。

 string host ：设置或返回当前页面URL的主机名称和端口。

 string hostname ：设置或返回当前页面URL的主机名称。

 string href ：设置或返回当前页面完整的URL。若设置时不加协议，设置的字符串只是改变URL最后一个'/'以后的字符串。

 string pathname ：设置或返回当前页面URL的路径部分。

 string port ：设置或返回当前页面URL的端口。若当前URL没有端口，返回一个''(空字符串)。

 string  protocol ：设置或返回当前页面URL的协议，最后面会有个':'冒号。

 string  search ：设置或返回当前页面URL的查询部分(从问号 (?) 开始的 URL)。

 readonly string  origin ：返回当前页面URL的源。返回格式：协议+主机名+端口；如：https://www.baidu.com

4.Method

 void  assign (string url) ：设置当前页面加载指定的url，等同于设置href属性的值为url。

 void reload () ：从新加载当前页面的URL。可当作为刷新操做。

 void replace (string url) ：设置当前页面加载指定的url，并在浏览器历史记录中替换掉当前地址，进行"后退"操做不会显示当前访问过的记录。

 

bom与dom的关系与区别

关联:由于document对象又是DOM（Document Object Model）模型的根节点。能够说，BOM包含了DOM(对象)，浏览器提供出来给予访问的是BOM对象，从BOM对象再访问到DOM对象，从而js能够操做浏览器以及浏览器读取到的文档。

区别:DOM描述了处理网页内容的方法和接口，BOM描述了与浏览器进行交互的方法和接口。

 本文转载自：http://www.cnblogs.com/polk6/p/5045277.html

相关文章
相关标签/搜索
每日一句
    每一个你不满意的现在，都有一个你没有努力的曾经。
本站公众号
   欢迎关注本站公众号,获取更多信息
联系我们 最近搜索 最新文章 沪ICP备13005482号-10 MyBatis教程 SQL 教程 MySQL教程 Java 教程 Thymeleaf 教程 Hibernate教程 Spring教程 Redis教程