BOM:浏览器对象模型 (Browser Object Model)主要定义的是JS操作浏览器的方法和属性。 大部分方法都在window下。

常用方法:(JS里面规定如果方法前面是window,window可以省略不写。)

open(地址url,打开的方式) :打开一个新的窗口,并返回新打开窗口的window对象。如果参数为空 默认为打开空白页面,默认为新窗口方式打开。

返回值:返回新打开的窗口的window对象。window.open();

close():关闭窗口,存在兼容问题,火狐下没反应, IE会询问是否确认关闭,谷歌直接关闭关闭时提示问题,不过这个属性并不常用。

可以关闭在本窗口中通过open方法打开的新窗口。 如下:

//实现 在本页面中打开一个新窗口,并点击本页面的一个按钮,再把新窗口关掉
opener = window.open(); //返回的新窗口对象
var btn.onclick = function(){
opener.close();
}

BOM常用属性

window.navigator.userAgent:浏览器的信息,比如版本号等
window.location:存放关于浏览器地址的一些信息,本身是一个对象,下面有方法和属性 。如下
window.location.href :浏览器具体地址 比如http://i.cnblogs.com/EditPosts.aspx?opt=1#123
window.location.search:地址栏问号后的信息,包括问号(?opt=1)
window.location.hash:地址栏#后的信息,包括#号。(#123)

文档可视区大小(指的是你视野范围可以看到的大小,不是实际大小。document是文档对象,documentElement文档元素

document.documentElement.clientWidth/clientHeight

滚动距离(可视区的顶部到页面实际的顶部的距离,其实就是滚动出去的距离,有兼容问题)

document.documentElement.scrollTop/scrollLeft:其他浏览器
document.body.scrollTop/scrollLeft :谷歌认为是body的而不是文档

兼容处理,以scrollTop为例:

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

文档实际的内容高度(包括超过父元素或者超出被隐藏的内容高度,padding+width)

document.body.scrollHeight(width)  

文档对象内容的高度,包括body的margin+padding+width+border。

document.documentElement.offsetHeight(IE下有问题,它认为这个和可视区的高一样)
document.body.offsetHeight(推荐用这个)不包括body的margin.

 window对象常用事件(事件触发次数是按时间间隔来算的,并不是你手动的频率

onscroll :当滚动条滚动的时候触发
onresize :当窗口发生改变的时候触发

var  i =0;

window.onscroll = function(){

    document.title = i++;

} 

window.onresize = function(){

    document.title = i++;

}

如果大家有不同意见,不要只是点反对,欢迎评论指正,不然我不知道哪里有问题额。。。。。。

关于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. SQL Server 2014新特性——事务持久性控制

    控制事务持久性 SQL Server 2014之后事务分为2种:完全持久, 默认或延迟的持久. 完全持久,当事务被提交之后,会把事务日志写入到磁盘,完成后返回给客户端. 延迟持久,事务提交是异步的,在 ...

  2. 编写IoDemo.java的Java应用程序,程序完成的功能是:首先读取text.txt文件内容,再通过键盘输入文件的名称为iodemo.txt,把text.txt的内容存入iodemo.txt

    package zuoye; import java.io.File; import java.io.FileInputStream; import java.io.FileNotFoundExcep ...

  3. Linux系统监控命令之iotop

    iotop命令 iotop命令是一个用来监视磁盘I/O使用状况的top类工具.iotop具有与top相似的UI,其中包括PID.用户.I/O.进程等相关信息.Linux下的IO统计工具如iostat, ...

  4. XP系统下IIS常见的几个问题

    随笔说明: 个人笔记.仅供参考 根据日常遇到的相关问题不定期增改 时间:2015年1月7日23:09 Soft:Microsoft .NET Framework 4(独立安装程序) Microsoft ...

  5. 定时器的应用---查询方式---让8个LED灯,左右各4个来回亮

    定时器的应用,查询方式.让8个LED灯,左右各4个来回亮 代码: /********************** 查询方式是主程序不断的查询是否中断,而不需要准备子程序 *************** ...

  6. node js学习(二)——REPL(交互式解释器)

    1.简介 Node.js REPL(Read Eval Print Loop:交互式解释器) 表示一个电脑的环境,类似 Window 系统的终端或 Unix/Linux shell,我们可以在终端中输 ...

  7. 如何生成可变表头的excel

    1.实现功能: 传入一个表头和数据,将数据导入到excel中. 为了便于项目的扩展,数据传入通过泛型集合传入,获取数据时,通过反射的方式获取,这样无论你的表头是多少项,我都能很方便的生成.另外为了便于 ...

  8. Nova 操作汇总(限 libvirt 虚机) [Nova Operations Summary]

    本文梳理一下 Nova 主要操作的流程. 0. Nova REST-CLI-Horizon 操作对照表 Nova 基本的 CRUD 操作和 extensions: # 类别 Nova V2 REST ...

  9. 创建基于Bootstrap的下拉菜单的DropDownList的JQuery插件

    Bootstrap是当下流行的前端UI组件库之一.利用Bootstrap,可以很方便的构造美观.统一的页面.把设计师从具体的UI编码中解放出来.   Bootstrap提供了不少的前端UI组件.带下拉 ...

  10. 2016"百度之星" - 初赛(Astar Round2B)

    Problem Description 中位数定义为所有值从小到大排序后排在正中间的那个数,如果值有偶数个,通常取最中间的两个数值的平均数作为中位数. 现在有n个数,每个数都是独一无二的,求出每个数在 ...