BOM即Browser Object Model,浏览器对象模型,表示浏览器窗口,所有js全局对象、函数以及变量均是window 对象的成员。

对于不同的浏览器,表示宽度和高度的方法不同:

对于IE9及以上、Chrome、Firefox、Opera以及Safari:window.innerHeight和window.innerWidth

对于IE5、6、7、8:document.documentElement.clientHeight和document.documentElement.clientWidth

其他的:document.body.clientHeight和document.body.clientWidth

window一些方法:

window.open() - 打开新窗口

window.close() - 关闭当前窗口

window.moveTo() - 移动当前窗口

window.resizeTo() - 调整当前窗口的尺寸

window.screen对象包含有关用户屏幕的信息,可省略前面的window

screen.height和screen.width:屏幕总高度和总宽度

screen.availHeight和screen.availWidth:可用的屏幕高度和宽度,以像素计,减去界面特性,比如窗口任务栏

screen.colorDepth:屏幕色彩深度

screen.pixelDepth:屏幕色彩分辨率

window.location 对象用于获得当前页面的地址 (URL),可省略前面的window

location.href:当前页面的 URL

location.hostname:web主机名

location.pathname:当前页面的路径和文件名

location.port:web主机端口

location.protocol:使用的web协议,http:或者https:

location.assign("URL"):链接到新页面

location.replace("URL"):跳转到新页面,效果与assign相同,但是通过assign跳转的页面可通过history.back退回到原来的页面,而replace会覆盖原来的无法回退

location.reload():重新加载,即刷新页面

window.history对象包含浏览器的浏览历史,可省略前面的window

history.back():与在浏览器点击后退按钮相同

history.forward():与在浏览器中点击向前按钮相同

window.navigator对象包含浏览器的信息,可省略前面的window

navigator.appCodeName:浏览器代号

navigator.appName:浏览器名称

navigator.appVersion:浏览器版本

navigator.cookieEnabled:是否启用Cookies

navigator.platform:硬件平台

navigator.userAgent:用户代理

navigator.systemLanguage:用户代理语言

弹框,可以在js中创建三种消息框,警告框alert()、确认框confirm()、提示框prompt(),三种方法都可以省略前面的window

alert('sometext'):警告框,需要点击确定按钮才能继续进行操作

confirm('sometext'):确认框,点击 "确认"返回 true, 点击 "取消"返回 false

prompt('sometext','defaultvalue'):提示用户在进入页面前输入值,defaultvalue为默认值,如果点击 "确认"返回值为输入的值,点击 "取消"返回值为 null

js BOM浏览器对象模型的更多相关文章

  1. JavaScirpt(JS)——BOM浏览器对象模型

    一.BOM概念 BOM(Browser Object Model)即浏览器对象模型.可以对浏览器窗口进行访问和操作.使用 BOM,开发者可以移动窗口.改变状态栏中的文本以及执行其他与页面内容不直接相关 ...

  2. js··BOM 浏览器对象模型

    1.window.open(url,ways) url 是打开的网页地址 ways 打开的方式 _self 2.window.close() 3.浏览器用户信息 Window.navigator 4. ...

  3. JavaScript——BOM(浏览器对象模型),时间间隔和暂停

    BOM(浏览器对象模型):能够对浏览器的窗体进行訪问和操作 1.主要的BOM体系: window------------document-------------------------------- ...

  4. 第一百一十一节,JavaScript,BOM浏览器对象模型

    JavaScript,BOM浏览器对象模型 学习要点: 1.window对象 2.location对象 3.history对象 BOM也叫浏览器对象模型,它提供了很多对象,用于访问浏览器的功能.BOM ...

  5. JS第三部分--BOM浏览器对象模型

    一.client系列:宽高边框 二.offset系列:偏移 三.scroll系列 四.BOM的介绍 4.1.打开新窗口 4.2.location对象(本地信息对象) 4.3.history对象 4.4 ...

  6. BOM浏览器对象模型

    访问和操作浏览器窗口的模型称为浏览器对象模型BOM(Browser Object Model). BOM整体对象图. 核心是window对象: 以下有特殊双重身份: window对象既是ECMAScr ...

  7. JavaScript(二、BOM 浏览器对象模型)

    一.BOM是什么 BOM是browser object model的缩写,简称浏览器对象模型 BOM提供了独立于内容而与浏览器窗口进行交互的对象 由于BOM主要用于管理窗口与窗口之间的通讯,因此其核心 ...

  8. javascript之BOM浏览器对象模型引入

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  9. BOM—浏览器对象模型(Browser Object Model)

     1,javascript   组成部分: 1.ECMAscript(核心标准):    定义了基本的语法,比如:if for 数组 字符串 ... 2.BOM  : 浏览器对象模型(Browser ...

随机推荐

  1. google的python语言规范

    Python语言规范   Lint Tip 对你的代码运行pylint 定义: pylint是一个在Python源代码中查找bug的工具. 对于C和C++这样的不那么动态的(译者注: 原文是less ...

  2. nginx相关知识

    一.负载均衡与反向代理 server { listen 9008; server_name localhost; location / { proxy_pass http://web_server; ...

  3. redis出现错误:NOAUTH Authentication required.

    出现认证问题,应该是设置了认证密码,输入密码既可以啦 注意密码是字符串形式! 127.0.0.1:6379> auth "yourpassword" 127.0.0.1:63 ...

  4. L - Father Christmas flymouse

    来源poj3160 After retirement as contestant from WHU ACM Team, flymouse volunteered to do the odds and ...

  5. vue2中使用transition

    最终效果为  div元素从右向左出现, 然后从左向右消失. transition标签包裹要移动的元素: css 样式: 其中: 1:  为div元素显示时的状态 2:  为div元素移动的过程 (进入 ...

  6. laravel之路由

    laravel之路由设置 代码如下: 访问就是: 代码附上: <?php /*|--------------------------------------------------------- ...

  7. 关于Could not load driverClass ${jdbc.driverClassName}问题解决方案

    在spring与mybatis3整合时一直遇到Could not load driverClass ${jdbc.driverClassName}报错如果将 ${jdbc.driverClassNam ...

  8. 再读vue2.0

    玩过一段时间后在来读读vue2.0会发现受益良多 概述: vue2.0 是一套构建用户界面的渐进式框架, 使用virtual DOM  提供了响应式和组件化, 允许使用简介的模板语法来声明式的将数据渲 ...

  9. 强制不使用“兼容性视图”的HTML代码

    转自:http://www.weste.net/2013/8-9/93109.html 在IE8浏览器以后版本,都有一个"兼容性视图",让不少新技术无法使用.那么如何禁止浏览器自动 ...

  10. 2018-2019-2 网络对抗技术 20165318 Exp2 后门原理与实践

    2018-2019-2 网络对抗技术 20165318 Exp2 后门原理与实践 后门的基本概念及基础问题回答 常用后门工具 netcat Win获得Linux Shell Linux获得Win Sh ...