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. Android新特性介绍,ConstraintLayout完全解析

    今天给大家带来2017年的第一篇文章,这里先祝大家新年好. 本篇文章的主题是ConstraintLayout.其实ConstraintLayout是Android Studio 2.2中主要的新增功能 ...

  2. 解决 nginx 出现 413 Request Entity Too Large 的问题

    1.若nginx用所用的 php 请求解析服务是 fpm, 则检查 /etc/php5/fpm/php.ini 文件中的参数 upload_max_filesize = 20M post_max_si ...

  3. VC++ 字符串Dword、LPSTR、LPWSTR、LPCSTR、LPCWSTR、LPTSTR、LPCTSTR

            类   型     MBCS  UNICODE TCHAR char char WCHAR wchar_t wchar_t LPSTR char* char* LPCSTR const ...

  4. js中 变量的解构赋值

    es6新特性, 提取数组或对象中的值,按照对应位置, 为变量赋值. let [a, b, c] = [1, 2, 3]; 交换变量的值变得容易 let x = 1; let y = 2; [x, y] ...

  5. adb 常用命名

    adb是Android Debug Bridge的简称, 就是起到调试桥的作用,用来操作android设备 adb help (显示帮助信息) adb devices (获取设备列表及设备状态) ad ...

  6. js中的值类型和引用类型的区别

    1.JavaScript中的变量类型有哪些? (1)值类型(基本类型):字符串(String).数值(Number).布尔值(Boolean).Undefined.Null  (这5种基本数据类型是按 ...

  7. 17.vue移动端项目二

    FilmList.vue 电影列表 <template> <div class="mz-film-list"> <!-- 正在热映 https://m ...

  8. win7 蓝屏信息获取和处理

    一.先说电脑蓝屏原因和解决方法: 1.驱动不对,驱动和硬件不兼容出现的问题,这个直接卸载软件或者重装驱动. 2.内存条有问题或者内存损坏:这个内存条很可能是没插紧,内存损坏的话,换个内存条. 3.病毒 ...

  9. http proxy模块参数

    http proxy模块参数 nginx功能的代理功能是是通过http proxy模块来实现的.默认在安装Nginx是已经安装了http proxy模块,可以直接使用. http模块相关参数 说明 p ...

  10. hive sqoop,sqoop-hive import data

    https://segmentfault.com/a/1190000002532293 https://www.zybuluo.com/aitanjupt/note/209968 create tab ...