一、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. Query插件之ajaxFileUpload使用方法——input.change()事件的时候实现文件上传

    点击下载 这是HTML <input id="uploadedfile" name="uploadedfile" type="file" ...

  2. php登录

    if ($name && $passowrd){ $sql = "SELECT * FROM liuyanban WHERE name = '$name' and passw ...

  3. 【翻译】go语言中的map实战

    业余时间翻译,水平很差,如有瑕疵,纯属无能. 原文链接 http://blog.golang.org/go-maps-in-action go语言中的map实战 1. 简介 哈希表是计算机科学中最重要 ...

  4. 卷积神经网络在tenserflow的实现

    卷积神经网络的理论基础看这篇:http://blog.csdn.net/stdcoutzyx/article/details/41596663/ 卷积神经网络的tenserflow教程看这里:http ...

  5. OpenCV学习(20) grabcut分割算法

    http://www.cnblogs.com/mikewolf2002/p/3330390.html OpenCV学习(20) grabcut分割算法 在OpenCV中,实现了grabcut分割算法, ...

  6. 一个简单易懂的javascrip selection&range小案例

    在制作富文本编辑器,尤其是在制作以div元素为编辑器区域时,当鼠标离开编辑区域以后会失去焦点,失去选区,这时候就要通过selection&range来重新设置选区.[以下代码尚未考虑IE低版本 ...

  7. ZOJ 3941 Kpop Music Party

    先把能合并的区间都合并起来. 考虑最裸的贪心策略,从左到右一段一段的取. 但是,这样会有错,错在没有考虑每段区间选取最后一个点. 因为N只有10,所以枚举一下哪些区间最后一个点会被选择,然后按照最裸的 ...

  8. man info --help区别

    --help: 是一个工具选项,可以用来显示一些工具的信息 man : 可以显示系统手册页中的内容,这些内容大多数都是对命令的解释信息 PS: () Space 键可以显示下一屏的文本信息 () q ...

  9. SocketChannel

    Java NIO 中的 SocketChannel 是一个连接到 TCP 网络套接字的通道.可以通过以下 2 种方式创建 SocketChannel: 打开一个 SocketChannel 并连接到互 ...

  10. iOS开发——delegate的相关警告

    警告:Assigning to 'id<...Delegate>' from incompatible type '...ViewController *const_strong' 解决方 ...