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. [MySQL Reference Manual] 5 MySQL 服务管理

    5. MySQL 服务管理 5. MySQL 服务管理 5.1 The Mysql Server 5.2 Mysql 服务日志 5.2.1 选择General query log和slow query ...

  2. SQL Server:“数据收缩”详解

    1. 数据库的相关属性 在MS中创建数据库时会为数据库分配初始的大小(如下图:数据库和日志两个文件),随着数据库的使用文件会逐渐增大.数据库文件大小的增加有两种方式: 自动增长:在自动增长中可以设置每 ...

  3. Visual Studio 2012中文旗舰版(序列号和下载地址)

    序列号:YKCW6-BPFPF-BT8C9-7DCTH-QXGWC 链接: http://pan.baidu.com/s/1pLGhDjl 密码: 3udq

  4. Oracle索引梳理系列(一)- Oracle访问数据的方法

    版权声明:本文发布于http://www.cnblogs.com/yumiko/,版权由Yumiko_sunny所有,欢迎转载.转载时,请在文章明显位置注明原文链接.若在未经作者同意的情况下,将本文内 ...

  5. tools:context=".MainActivity的作用(转)

    android:layout_width="match_parent" android:layout_height="match_parent" android ...

  6. yum简单安装apache

    yum install httpd -y chkconfig    httpd  on service httpd start  启动软件

  7. uva 12745 Wishmaster(2-sat)

    12745 Wishmaster view code#include <iostream> #include <cstdio> #include <algorithm&g ...

  8. Virtualbox配置双网卡

    hadoop内部的虚拟机群,使用Host-Only 因为我之前一直是把三台虚机配置成桥接网络,可以同时上网又可以互通,但有一段时间,网络一直不通畅,造成hadoop核心进程一直关闭. 最后为了稳定起见 ...

  9. C#基础---事件的使用

    一:什么是事件     事件是可以被控件识别的操作,如按下确定按钮,选择某个单选按钮或者复选框.每一种控件有自己可以识别的事件,如窗体的加载.单击.双击等事件,编辑框(文本框)的文本改变事件,等等.事 ...

  10. 清除浮动clear/BFC

    浮动的清除有两种方式: 一.clear clear:both/left/right; 二.创建BFC (1)什么是BFC? BFC,块级格式化上下文,是一个独立的渲染区域,只有Block-level ...