一、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. margin问题

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  2. Flocker 做为后端存储代理 docker volume-driver 支持

    docker Flocker https://github.com/ClusterHQ/flocker/ 文档: https://docs.clusterhq.com/en/latest/docker ...

  3. PL\SQL学习笔记

    注释 单行--多行 一.declare一般用于做变量的申明.begin 程序体开始执行  end; 程序体结束exception .. dbms_output.put_line('绝对值'||v_ab ...

  4. Java基础知识(一) 自增、自减运算符

    .d1 { border-style: none } .d2 { border-style: solid } .d3 { border-style: dotted } .d4 { border-sty ...

  5. jQuery Ajax 二次封装

    jQuery Ajax通用js封装 第一步:引入jQuery库 <script type="text/javascript" src="<%=path%> ...

  6. [iOS]C语言技术视频-11-指针变量练习一(交换值)

    下载地址: 链接: http://pan.baidu.com/s/1pJIcGm3 密码: s83p

  7. ZOJ 3946 Highway Project

    1.迪杰斯特拉最小堆 #include<cstdio> #include<cstring> #include<cmath> #include<map> ...

  8. CSS-学习笔记六

    1. 自适应,响应式布局 2. pure 3. Animate

  9. Nginx负载均衡策略

    目前nginx负载均衡支持的5种方式的分配 1. 轮询 每个请求按时间顺序逐一分配到不同的后端服务器,如果后端服务器down掉,能自动剔除. upstream backserver { server ...

  10. Android 状态栏通知Notification、NotificationManager详解

    http://www.cnblogs.com/onlyinweb/archive/2012/09/03/2668381.html