1. BOM

1.1 window

BOM的核心对象是window,它表示浏览器的一个实例。在浏览器中,window对象有双重身份,

1.1.1 全局作用域

由于window对象同时扮演着ECMAScript中Global对象的角色,因此所有在全局作用域中声明的变量、函数都会变成window对象的属性和方法。

1.1.2 窗口关系及框架

如果页面中包含框架,则每个框架都拥有自己的window对象,并且保存在frames集合中。在frames集合中,可以通过数值索引(从0开始,从左至右,从上到下)或者框架的名称来访问相应的window对象。

top对象始终指向最高(最外)层的框架,也就是浏览器窗口

parent对象始终指向当前框架的直接上层对象

self对象始终指向window对象

1.1.3 窗口位置

用来确定和修改window对象的属性和方法有很多,

IE,Safari,Opera和Chrome提供了screenLeft和screenTop属性,分别用于表示窗口相对于屏幕左边和上边的位置

Firefox则提供screenX和screenY提供相同的窗口位置信息

1.1.4 窗口大小

跨浏览器确定窗口大小不是一件容易的事,虽然无法确定浏览器窗口本身的大小,但却可以取得页面视口的大小

var pageWidth = window.innerWidth;

var pageHeight = window.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;

}

}

1.1.5 导航和打开窗口

使用window.open()既可以导航到一个特定的URL,也可以打开一个新的浏览器窗口。

这个方法接受四个参数:要加载的URL,窗口目标,一个特定的字符串以及一个新页面是否取代浏览器历史记录中当前加载页面的布尔值。

1.1.6 间歇调用和超时调用

var timeoutid = setTimeout(function() {

alert('hi');

}, 1000); //一秒后调用

clearTimeout(timeoutid); //取消

var intervalid = setInterval(function(){

alert('ho');

},1000); //一秒钟调用1次

clearInterval(intervalid);//取消

1.2 location

location是最有用的BOM对象之一,它既是window对象的属性也是document对象的属性。

属性名

例子

说明

hash

#contents

返回URL中的hash(#后跟0或多个字符),如果URL中不包含散列,则返回空字符串

host

www.wrox.com:80

返回服务器名称和端口号(如果有)

hostname

www.wrox.com

返回不带端口号的服务器名称

href

http:/www.wrox.com

返回当前加载页面的完整URL。而location对象的toString()方法也返回这个值

pathname

/wiley/

返回URL中的目录和(或)文件名

port

8080

返回URL中指定的端口号。如果URL中不存在端口号,则这个属性返回空字符串

protocol

http:

返回页面使用的协议。通常是http:或者https:

search

?q=javascript

返回URL地址中的查询字符串。这个字符串以问号开头

1.3 navigator

主要用来识别客户端浏览器的事实标准

1.4 screen

screen对象基本上只能用来表明客户端的能力,其中包括浏览器窗口外部的显示器信息等。

1.5 history

history对象是window对象的属性,保存着用户上网的历史记录。history存在go,back,forward三个方法用来浏览历史记录。

//后退一页

history.go(-1);

//前进一页

history.go(1);

//前进2页

history.go(2);

//跳转到历史记录的 baidu.com网站

history.go("baidu.com");

//后退一页

history.back();

//前进一页

history.forward();

history对象还有一个length属性,保存在历史记录的数量。这个数量包括所有历史记录,即所有向前和向后的记录。

8. javacript高级程序设计-BOM的更多相关文章

  1. Javascript高级程序设计——BOM(浏览器对象模型)

    BOM(浏览器对象模型),它提供了独立于内容而与浏览器窗口进行交互的对象.BOM由一系列相关的对象构成.一.window对象      window对象表示整个浏览器窗口,但不必表示其中包含的内容.W ...

  2. 1. javacript高级程序设计-JavaScript简介

    JavaScript诞生于1995年,由Netscape公司布兰登·艾奇开发,JavaScript主要包括三个部分: (1). ECMAScript,由ECMA-262定义,提高核心语言功能 (2). ...

  3. 笔记-JS高级程序设计-BOM篇

    BOM提供了很多对象,用于访问浏览器的功能.这些功能与任何网页无关. 1BOM的核心对象是window,它代表浏览器的一个实例,它是通过JS访问浏览器窗口的一个借口,同时又是ECMAScript规定的 ...

  4. 2020/6/10 JavaScript高级程序设计 BOM

    BOM(浏览器对象模型):提供用于访问浏览器的对象. 8.1 window对象 window是BOM的核心对象,表示浏览器的一个实例. JavaScript访问浏览器窗口的接口 ECMAScript规 ...

  5. 25. javacript高级程序设计-新兴的API

    1. 新兴的API requestAnimationFrame():是一个着眼于优化js动画的api,能够在动画运行期间发出信号.通过这种机制,浏览器就能够自动优化屏幕重绘操作 Page Visibi ...

  6. 24. javacript高级程序设计-最佳实践

    1. 最佳实践 l 来自其他语言的代码约定可以用于决定何时进行注释,以及如何进行缩进,不过JavaScript需要针对其松散类型的性质创造一些特殊的约定 l javascript应该定义行为,html ...

  7. 23. javacript高级程序设计-数据存储

    1. 数据存储 1.1 cookie HTTP Cookie, cookie,最初用来在客户端存储回话信息. (1). 限制,不同浏览器对特定域名下的cookie 的个数有限制,每个域名下最好不要操过 ...

  8. 22. javacript高级程序设计-高级技巧

    1. 高级技巧 1.1 函数 l 可以使用惰性载入函数,将任何分支推迟到第一个调用函数的时候 l 函数绑定可以让你创建始终在指定环境中运行的函数,同时函数柯里化可以让你创建已经填写了某些参数的函数 l ...

  9. 21. javacript高级程序设计-Ajax与Comet

    1. Ajax与Comet 1.1 XMLHttpRequest对象 IE5是第一款引入XHR对象的浏览器,IE5中是通过MSXML库中的一个ActiveX对象实现的.因此在IE中可能存在MSXML2 ...

随机推荐

  1. JavaScript基础整理(2)

    接下来的重点是函数.我们知道函数是特殊的对象. 函数作用域和声明提前.JavaScript中没有块级作用域,只有函数作用域:变量在声明它们的函数体以及这个函数体嵌套的任意 函数体内都要定义. func ...

  2. WebService 之 WSDL文件 讲解

    原文地址:http://blog.csdn.net/tropica/archive/2008/11/02/3203892.aspx 恩,我想说的是,是不是经常有人在开发的时候,特别是和第三方有接口的时 ...

  3. Unity API

    关于 int Mathf.PingPong(t, length); 原理,相当于 #include <iostream> #include <vector> int test( ...

  4. JS URL传递中文参数时出现乱码的处理

    在浏览器中显示的地址是这样的: 但是按F12调试的时候的地址却变化掉了: 这个肯定是是因为浏览器对url路径默认编码了.这个问题是在我们去取值的时候,得到的就是后面那一大串稀奇古怪的东西.得不到我们想 ...

  5. AngularJS 使用$sce控制代码安全检查

    由于浏览器都有同源加载策略,不能加载不同域下的文件.也不能使用不合要求的协议比如file进行访问. 在angularJs中为了避免安全漏洞,一些ng-src或者ng-include都会进行安全校验,因 ...

  6. MySQL的Order By Rand()的效率问题

    MySQL很多时候需要获取随机数据,举个例子,要从tablename表中随机提取一条记录,大家一般的写法就是: 但是,后来我查了一下MYSQL的官方手册,里面针对RAND()的提示大概意思就是,在OR ...

  7. 求方程式ax^2+bx+c=0的根。

    #include <stdio.h>#include <stdlib.h>#include<math.h>int main(){ int a,b,c,d; doub ...

  8. 【C语言入门教程】7.5 枚举

    在实际应用中,有的变量只有几种可能取值.如人的性别只有两种可能取值,星期只有七种可能取值.在 C 语言中对这样取值比较特殊的变量可以定义为枚举类型.所谓枚举是指将变量的值一一列举出来,变量只限于列举出 ...

  9. Mac Pro 解压安装MySQL二进制分发版 mysql-5.6.30-osx10.11-x86_64.tar.gz(不是dmg的)

    没有mac的root密码,当前用户有sudo权限,所以想以root身份执行的命令都加了sudo. 是否存在 _mysql 用户和用户组,并查看用户 _mysql 是不是用户组 _mysql 的成员. ...

  10. EL表达式和JSTL

    EL相关概念JSTL一般要配合EL表达式一起使用,来实现在jsp中不出现java代码段.所以我们先来学习EL表达式 EL主要用于查找作用域中的数据,然后对它们执行简单操作:它不是编程语言,甚至不是脚本 ...