一、BOM概念

  BOM:Browser Object Model  浏览器对象模型,定义了JS操作浏览器的一些方法和属性

二、BOM方法 (在BOM里面大部分的方法都是调用window对象下的方法得到的)

  1、open(页面的地址url,打开的方式)  方法  打开一个新的窗口(页面)

    (1) 如果url为空,则默认打开一个空白页面;

    (2) 如果打开方式为空,默认为新窗口方式打开;

    (3) 如果不写参数,则以新窗口的方法打开一个空白页面;

    返回值:返回新打开的窗口window对象

  2、close()  方法  关闭窗口

    (1) ff: 默认无法关闭

    (2) chrome: 默认直接关闭

    (3) ie: 询问用户

三、BOM属性

  1、window.navigator.userAgent :  可以得到当前浏览器的信息

  2、window.location : 浏览器地址信息

    (1) window.location.href : url   也是浏览器的地址信息

    (2) window.location.search : url?后面的内容

    (3) window.location.hash : url#后面的内容

四、BOM 窗口尺寸大小

  1、可视区的尺寸

    document.documentElement.clientWidth

    document.documentElement.clientHeight

  2、 滚动条滚动距离(存在兼容)

    (1) 其他浏览器均认为是文档的滚动条,因此是文档下的:

      document.documentElement.scrollTop[scrollLeft]

    (2) 谷歌浏览器认为滚动条是body的滚动条,因此是body下的:

      document.body.scrollTop[scrollLeft]

    解决方案:

    var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;

  

  3、 内容高 ( 不算边框外里面的内容 )

    oDiv.scrollHeight(Width);

  4、文档高

    document.documentElement.offsetHeight

    如果说获取documentElement的高度,会存在兼容问题,一般我们都是获取body的高度

    document.body.offsetHeight

五、BOM 事件

  1、onscroll : 当滚动条滚动的时候触发

    window.onscroll = function (){  };

  2、onresize : 当窗口大小发生改变的时候触发

    window.onresize = function (){  };

BOM总结的更多相关文章

  1. HTML BOM Browser对象

    BOM:Browser Object Model,即浏览器对象模型,提供了独立于内容的.可以与浏览器窗口进行互动的对象结构. Browser对象:指BOM提供的多个对象,包括:Window.Navig ...

  2. 一步步学习javascript基础篇(7):BOM和DOM

    一.什么是BOM.什么是DOM BOM即浏览器对象模型,主要用了访问一些和网页无关的浏览器功能.如:window.location.navigator.screen.history等对象. DOM即文 ...

  3. BOM,DOM,ECMAScripts三者的关系

    一:DOM 文档对象模型(DOM)是表示文档(比如HTML和XML)和访问.操作构成文档的各种元素的应用程序接口(API) DOM是HTML与JavaScript之间沟通的桥梁.   DOM下,HTM ...

  4. javascript学习之BOM

    BOM是browser object model的缩写,简称浏览器对象模型.先看看下面这张图 window对象是BOM的顶层(核心)对象,所有对象都是通过它延伸出来的,也可以称为window的子对象. ...

  5. BOM以及定时器

    一.BOM 1.操作浏览器的一些方法 (浏览器对象模型) 2.window是is中的顶级变量,是一个全局的变量,所有人都可以访问到它,基本 的方法和属性 (document,alert,console ...

  6. js浏览器对象模型(BOM)

    浏览器对象模型(Browser Object Model,BOM):浏览器为js提供的对象集合. 1 windows对象 windows对象:表示浏览器的框架以及与其相关的内容,比如滚动条和导航栏图标 ...

  7. BOM操作

    BOM操作 //浏览器对象模型 opener=window.open(页面的url,打开方式) opener.document.body.style.background="red" ...

  8. 什么是BOM头,BOM头有什么影响,怎么去掉BOM头

    什么是bom头? 在utf-8编码文件中BOM在文件头部,占用三个字节,用来标示该文件属于utf-8编码,现在已经有很多软件识别bom头,但是还有些不能识别bom头,比如PHP就不能识别bom头,这也 ...

  9. Txt格式配置表无法解析的问题——BOM

    今天再次遇到同一个问题:策划给来一个Txt格式配置表,我用解析类去读取,返回的结果为空.解析类参数是:主键key,文件名fileName,错误提示errorTip. 写读取语句的时候,主键key我是直 ...

  10. BOM对象有哪些:

    BOM对象有哪些: 1.window对象 ,是JS的最顶层对象,其他的BOM对象都是window对象的属性: 2.document对象,文档对象: 3.location对象,浏览器当前URL信息: 4 ...

随机推荐

  1. kali系统安装

    kali live 安装到U盘 http://www.backtrack.org.cn/thread-17197-1-1.html 用Live U盘安装Kali Linux http://cn.doc ...

  2. ant调用shell命令(Ubuntu)

    ant中调用Makefile,使用shell中的make命令 <?xml version="1.0" encoding="utf-8" ?> < ...

  3. pycharm 安装venv的依赖包

    (venv)$ pip install -r requirements.txt

  4. SDAU课程练习--problemC

    题目描述 Here is a famous story in Chinese history. "That was about 2300 years ago. General Tian Ji ...

  5. Android复习--广播

    广播有两种方式,一种静态广播,一种动态广播. 静态广播-->静态广播接收器在配置文件里面注册. 动态广播-->而动态广播接收器在代码里面注册. 广播的发送: Context.sendBro ...

  6. DataGridView如何实现列标头带数据筛选功能,就象Excel高级筛选功能一样

    '近日有本论坛网友问:DataGridView如何实现列标头带数据筛选功能,就象Excel高级筛选功能一样 '今晚正好闲着没事,加之以前也没用到过这个需求,所以就写了个模拟功能,供各位坛友酌情参考. ...

  7. Altera Soc交叉编译环境搭建

    该文主要是对rocketboard教程的补充,详细教程参见https://rocketboards.org/foswiki/view/Documentation/EmbeddedLinuxBeginn ...

  8. AD进行行PCB DRC检查时,软件提示...report_drc.xsl不存在

    之前装过一次AD软件没有报过这样的错误,卸掉后重新装了之后,在对电气规则检查检查时“软件提示...report_drc.xsl不存在”. 原因:之前装的目录默认在C盘下,所以AD软件输出的报告也是默认 ...

  9. Python 100例(下)

    如果你坚持到这了,哪就为自己鼓掌吧!坚持,你一定可以. 实例51: 题目:学习使用按位与&. #!/usr/bin/env  python# --*--coding:utf-8 --*--'' ...

  10. extjs入门

    http://blog.csdn.net/xiebaochun/article/details/36414437