js008-BOM

本章内容:

1、理解window对象-BOM的核心

2、控制窗口、框架和弹出窗口

3、利用location对象中的页面信息

4、使用navigation对象了解浏览器

ECMAScript是JavaScript的核心。BOM(浏览器对象模型)才是JavaScript真正的核心。

8.1 window对象

BOM核心对象是window,表示浏览器的一个实例。

 

8.1.1全局作用域

由于window对象也是ECMAScript种的global对象的角色,所以所有全局作用域中声明的变量,函数都会变成window对象的属性和方法。如:

var age = 29;

function sayAge(){

alert(this.age);

}

alert(window.age);

sayAge();

window. sayAge ();

结果都是29.。

var age = 29;

window.color = "red";

//在IE< 9时抛出错误,其他浏览器都返回false

delete window.age;

//在IE< 9时抛出错误,其他浏览器都返回true

delete window.color;   //true

alert(window.age);   //29

alert(window.color);   //undefined

定义全局变量和在window对象上直接定义属性有差别:全局变量不能通过delete操作符删除,而直接在window对象上直接定义的属性可以。

使用var定义的window属性有个[[configurable]]的特性,其默认值为false,所以不能用delete删除

//抛出错误

var newValue = oldvalue;

//不会抛出错误,这只是一次属性查询

//newValue的值是Undefined

var newValue = window.oldvalue;

尝试访问未声明的变量会抛出错误,但是通过查询window对象,可以知道某个为生命的变量是否存在

8.1.2窗口关系及框架

window.frames[0];

window.frames["topframe"];

top.frame[0];

top.frames["topframe"];

frame[0];

frames["topframe"];

window.frames[1];

window.frames["leftframe"];

top.frame[1];

top.frames["leftframe"];

frame[1];

frames["leftframe"];

window.frames[2];

window.frames["rightframe"];

top.frame[2];

top.frames["rightframe"];

frame[2];

frames["rightframe"];

总体来说没怎么看明白parent这个东西。

8.1.3窗口位置

用来修改window对象位置。如IE、Safari、Opera、Chrome提供的 screenLeft和screenTop。Firefox的screenX和screenY,Safari、Chrome也支持这连个属性。

下列代码可以跨浏览器去的窗口左边和上边的位置

var leftPos = (typeof window.screenLeft == "number") ?

window.screenLeft : window.screenX;

var topPos = (typeof window.screenTop == "number") ?

window.screenTop : window.screenY;

//将窗口移动到屏幕左上角

window.moveTo(0 , 0);

//将窗口向下移动100px

window.moveBy(0 ,100);

//将窗口移动到(200 , 300)

window.moveTo(200 , 300);

//将窗口向左移动50px

window.moveBy(-50 ,0);

使用moveTo()  moveBy()方法可能将窗口精确的移动到一个新位置。这两个方法都接收两个参数。其中moveTo()就收的是新位置的x和y值。

moveBy()接收的是在水平和垂直方向上移动的像素数。

这两个方法会被浏览器禁用 ,不适用与框架。只能对最外层的window对象使用。

8.1.4窗口大小

可以取得可视窗口大小的属性:clinetWidth和clinetHeight

调整浏览器窗口的大小的方法:resizeTo()和resizeBy()。用法和前面的moveTo(), moveBy()用法一样。同样不适用框架,只能在window最外层使用,同样会被浏览器禁用。

8.1.5导航和打开窗口

使用window.open()方法。可接收四个参数:要加载的URL(通常指使用第一个)、窗口目标、一个特性字符串和一个表示新页面是否取代浏览器历史记录中当前加载页面的布尔值(打不开页面时使用)。

1、弹出窗口

2、安全限制

3、弹出窗口屏蔽程序

8.1.6间歇调用和超时调用

JS是单线程语言

超时调用需要使用window对此昂的setTimeou()方法,接收两个参数:要执行的代码(最好不要是字符串)和以毫秒表示的时间

8.1.7系统对话框

通过alert()  confirm()  prompt()方法可以调用系统对话框向用户显示消息。

8.2 location对象

location对象是最有用的BOM对象之一,它提供了一些导航功能,也提供了与当前窗口中加载的文档有关的信息。它是一个很特别的对象,既是window对象的属性也是document对象的属性。所以window.location 和 document.location引用的是同一个对象

以下为location对象的所有属性

属性名

例子

说明

hash

“#contents”

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

host

“www.wrox.com:80”

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

hostname

“www.wrox.com”

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

href

“http:/ www.wrox.com”

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

pathname

“/WileyCDA/”

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

port

“8080”

返回URL中指定的端口号,如果没有端口号,返回控制符串

protocol

“http:”

返回页面使用的协议

search

“?q=javascript”

返回URL的查询字符串,以?开头

8.2.1查询字符串参数

8.2.2位置操作

使用location对象来改变浏览器的位置,最常用的方法是assign()方法,并为其传递一个URL.

location.assign(“http:/ www.wrox.com”);

8.3 navifator对象

8.3.1检测插件

检测浏览器中是否安装了特定的插件是最常见的检测历程。在IE中可以用plugins数组拉埃达到这个目的。该数组中的每一项都包含下列属性。

1、  name:插件名称

2、  description:插件描述

3、  filename:插件的文件名

4、  length:插件做出的MIME类型数量

在IE中检测插件的为方式就是使用转悠的ActiveXObject类型,并尝试创建一个热定插件的实例

8.3.2注册处理程序

Firefox 为navigator对象新增了registerContentHander()和registerProtocolHander()方法。这两个方法可以让一个站点执行它可以处理特定类型的信息。

registerContentHander()方法接收三个参数:要处理的MIME类型、可以处理该MIME类型的页面的URL、应用程序的名称。

8.4 screen对象

一个在js变成中用处不大的对象,基本上只用来表明客户端的能力。

8.5 history对象

该对象保存着用户上网的历史记录。从窗口被打开的那一刻起。history是window对象的属性。

使用go()方法可以在用户的历史记录中任意跳转。可以向前向后。

history.go(1);

history.back();

//后退一页

history.go(1);

history.forward()

//前进一页

声明:本博客为http://www.cnblogs.com/lal-fighting/原创发布,未经允许禁止私自转载或抄袭!!!

js008-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. java文件cmd运行出现中文乱码

    今天刚开始学java,使用cmd命令执行java文件的时候,发现中文打出来是一串乱码. 于是就百度了一下,发现一个行之有效的方法. 首先使用命令:javac -encoding utf-8 Hello ...

  2. 东大OJ-一元三次方程解的个数

    1043: Fixed Point 时间限制: 5 Sec  内存限制: 128 MB 提交: 26  解决: 5 [提交][状态][讨论版] 题目描述 In mathematics, a fixed ...

  3. stack 栈的实现

    今天晚上去「南哪」听了场AI的讲座,除了话筒真心不给力之外,算是对微软这方面的进展有了更多了解,毕竟是半宣传性质的活动吧. 光听这些是没用的,眼下还是打好基础,多尝试学点新技术,拓宽能力和视野比较重要 ...

  4. 屠龙之路_任生活如何虐你,屠龙之路还得继续_SeventhDay

    摘要 :屠龙少年在"罢工"了一天,在周末客栈补给和放纵之后,突然想起来说好的和公主私奔呢?(此处出现了为何上篇随笔不见公主)咋想之下,貌似公主还在恶龙Alpha的手中.为此,屠龙少 ...

  5. Smarty单模板多缓存

    Smarty单模板多缓存 单模板多缓存 在生成缓存.判断缓存是否存在时,增加第二个参数,会根据第二个参数来确定对应的缓存文件 清除缓存

  6. canvas三角函数直线运动

    var canvas = document.getElementById("canvas"); var cxt = canvas.getContext("2d" ...

  7. 二叉树的建立与递归遍历C语言版

    </pre><pre name="code" class="cpp">#include <stdio.h> #include ...

  8. ubuntu静态IP配置

    1. 修改配置文件/etc/network/interfacesroot@ubuntu:~# sudo gedit /etc/network/interfaces 添加以下内容:auto eth0   ...

  9. 那些用JavaScript写的操作系统

    之前有人说过Chrome是新的C语言运行环境(Chrome Is The New C Runtime) ,不过笔者更倾向于Web是新的C语言运行环境,而且这种技术绝对没有版权问题,也绝不会被一家公司垄 ...

  10. WEB界面onload前的加载流程❤❤

    开始的流程: 1.先发请求给DNS进行域名解析获取服务器IP 2.向步骤1获取的服务器IP发送HTTP请求 //服务器的内部处理 3.服务器接收请求后,解析主机头对应的站点,把请求传送给站点 //返回 ...