BOM的核心对象是window,它既表示浏览器窗口以及页面可见区域,同时也是ECMAScript中的Globe对象,所有的全局变量和函数都是它的属性,并且所有的原声函数以及其他函数也都存在于它的命名空间下。

一,window窗口相关设置

1)获取浏览器窗口在显示屏的位置

根据浏览器不同,可以采用screenLeft,screenTop或者screenX,screenY,跨浏览器的代码如下:

//获取浏览器的位置
var leftPos=(typeof window.screenLeft =='number')?window.screenLeft:window.screenX;
var topPos=(typeof window.screenTop =='number')?window.screenTop:window.screenY;

2)移动浏览器窗口的位置

moveTo,moveBy.不过该方法一般浏览器是禁用的

3)获取浏览器窗口大小,以及浏览器页面视口的大耵浏览器窗口的大小

不同浏览器的实现方法不同,最终无法确定浏览器窗口本身的大小,但是可以取得页面视口的大小

//获取浏览器视口的位置
var pageWidth=document.innerWidth;
var pageHeight=document.innerHeight;
if(typeof pageWidth!="number"){
    if(document.compatMode=="CSS1Compat"){
        pageWidth=document.documentElement.clientWidth;
        pageHeight=document.documentElement.clientHeight;
    }else{
        pageWidth=document.body.clientWidth;
        pageHeight=document.body.clientHeight;
    }
}
alert(pageWidth+","+pageHeight);

4)调整浏览器窗口大小

可以利用resizeTo()和resizeBy()两个方法,不过这个方法一般也是被禁用的。

二、window相关的全局对象

1.location对象

1)location即是window的属性,也是document的属性,代表当前页面的访问地址

2)locaiton可以通过host,href,pathname,protocol,search等属性,访问当前url地址的相关字段

3)location可以改变当前的访问地址。多采用location.href="新地址"

4)location.reload()重新加载页面

2.navigation对象

代表浏览器应用,可以查询浏览器的版本,名称等。在实际中应用不多。

3.history对象

该对象保存着用户的上网历史,history.go(-n),history.go(n),如果仅仅前进/后退一步,可以使用back(),forward(),来模仿浏览器的前进/后退操作。

三、window相关的全局函数

1.Math,Date等对象提供的相关工具函数

2.window.open()弹出框函数,该方法可以导航到一个特定的url,可以打开一个新的浏览器窗口,接受四个参数,URL,窗口目标,一个特性字符串("_self,_blank,_parent等"),以及是否在浏览器历史记录中记录当前加载页面的布尔值。有些时候,弹出窗会受限于浏览器的安全限制。

3.间歇调用和超时调用

setTimeOut():接受两个参数,函数以及经过多长时间后该函数被调用

setInterVal():接受两个参数,函数以及每间隔多长时候该函数被调用一次

4,系统相关对话框

alert(),confirm(),prompt()

这几个对话框的外观由浏览器决定,而不是由css决定,同时,这些对话框都是同步和模态的,也就是说,显示这些对话框的时候,代码会停止运行,直到关闭这些对话框。

JavaScript学习笔记之BOM的更多相关文章

  1. JavaScript学习笔记之BOM对象

    目录 1.Window 2.Window Screen 3.Window Location 4.Window History 5.Window Navigator 浏览器对象模型(Browser Ob ...

  2. JavaScript学习笔记(13)——BOM

    1.window 所有浏览器都支持window对象,它表示浏览器窗口本身. 所有 JavaScript 全局对象.函数以及变量均自动成为 window 对象的成员. 全局变量是 window 对象的属 ...

  3. Java程序猿的JavaScript学习笔记(汇总文件夹)

    最终完结了,历时半个月. 内容包含: JavaScript面向对象特性分析,JavaScript高手必经之路. jQuery源代码级解析. jQuery EasyUI源代码级解析. Java程序猿的J ...

  4. Java程序猿的JavaScript学习笔记(8——jQuery选择器)

    计划按例如以下顺序完毕这篇笔记: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScript ...

  5. Java程序猿JavaScript学习笔记(2——复制和继承财产)

    计划和完成在这个例子中,音符的以下序列: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaSc ...

  6. Java程序猿的JavaScript学习笔记(3——this/call/apply)

    计划按例如以下顺序完毕这篇笔记: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScript ...

  7. Java程序猿JavaScript学习笔记(4——关闭/getter/setter)

    计划和完成这个例子中,音符的顺序如下: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScr ...

  8. Java程序猿JavaScript学习笔记(14——扩大jQuery UI)

    计划和完成这个例子中,音符的顺序如下: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScr ...

  9. javascript学习笔记(四) Number 数字类型

    数字格式化方法toFixed().toExponential().toPrecision(),三个方法都四舍五入 toFixed() 方法指定小数位个数  toExponential() 方法 用科学 ...

随机推荐

  1. Radeon HD 7850 vs Radeon R9 270X

    Radeon HD 7850 vs Radeon R9 270X  HW compare   Intro The Radeon HD 7850 comes with a GPU core speed ...

  2. Apache Spark技术实战之2 -- PackratParsers实例

    欢迎转载,转载请注明出处,徽沪一郎 概要 通过一个简明的Demo程序来说明如何使用scala中的PackratParsers DemoApp import scala.util.parsing.com ...

  3. HTTP 笔记与总结(9)分块传输、持久链接 与 反向 ajax(comet / server push / 服务器推技术)

    反向 ajax 又叫 comet / server push / 服务器推技术 应用范围:网页聊天服务器,例如新浪微博在线聊天.google mail 网页聊天 原理:一般而言,HTTP 协议的特点是 ...

  4. Navicat for MySQL数据库管理工具

    官网下载地址:http://www.navicat.com/download/navicat-for-mysql  //如图所示成功建立连接 Host Nmae/Ip Adress:localhost ...

  5. MongoVUE的使用

    配置连接:   Ok,连接成功齐活儿~   下面来试一下,插入一个新的名为Message的Collection :     然后插入个Document  

  6. hiho48 : 欧拉路·一

    时间限制:10000ms 单点时限:1000ms 内存限制:256MB 描述 小Hi和小Ho最近在玩一个解密类的游戏,他们需要控制角色在一片原始丛林里面探险,收集道具,并找到最后的宝藏.现在他们控制的 ...

  7. 关于Java中文乱码与日期格式

    关于Java中文乱码与日期格式 Java中文乱码的问题其实很普遍了,首先,一般不会在Windows平台下面出现,同时,一般在Tomcat应用服务器下也都正常,但是到了WebSphere,Weblogi ...

  8. ubuntu 制作deb 包

    ubuntu下打包制作deb安装包 http://www.th7.cn/system/lin/201406/61012.shtml   2014-06-22 20:16:45CSDN-yangbing ...

  9. 非模态对话框的PreTranslateMessage() 没有用,无法进去

    非模态对话框的的PreTranslateMessage确实进不去, 自然也无法用重载PreTranslateMessage的方法来响应键盘消息. 可以用Hook的方法来使其生效. http://bbs ...

  10. MVC中JQuery文件引入的路径问题,@Url.Content函数

    今天写了个MVC的Demo,文件夹结构很简单,如下: 利用EF生成Model框架并手工加表字段注解,但在页面上JS验证始终没显示.实在无语. 无意中在浏览器里按F12,看见提示:   Failed t ...