javascript包含三个部分，ECMAScript，BOM和DOM。ECMAScript是javascript的核心，包含javascript的基础语法。在Web中使用javascript，BOM则是集成在Javascript的关于浏览器的部分。BOM提供了很多对象用于访问浏览器的功能，这些功能与网页内容无关。

一、window对象

BOM的核心对象是window，他表示一个浏览器的实例。在浏览器中，window担任两个角色，window既是javascript访问浏览器窗口的一个接口，同时又是ECMAScript中的Global对象。ECMAScript可以用于不同的环境，不仅仅局限于浏览器，为了是ECMAScript能够作为浏览器的脚本语言使用，采用window来代替其中的Global对象。

1、全局作用域

由于window同时扮演者ECMAScript中Global对象的角色，所以在全局作用域中声明的变量，函数都会变成window对象的变量和方法

var age=29；

function sayAge()

{

  alert(this.age);

}

alert(window.age);//      
sayAge();//
window.sayAge();//

由于是全局作用域，所以this代替的就是window。

全局变量是不能通过delete删除的，但是在window对象上定义的属性是可以被删除的。如下所示

window.color="red";

delete window.age;//出错

delete window.color;//正确

这是因为直接定义的变量的【Configurable】属性的值为false，而通过window对象定义的属性【Configurable】属性的值为true。

2、窗口关系及框架

如果页面中包含框架，则每个框架都有自己的window对象，并且保存在frames集合中。在frames集合中，可以通过数值索引或者框架名称来访问相应的window对象。每个window对象都有一个name属性，其中包含框架的名称。

<html>

  <head>

    <title>Frameset Example</title>

  </head>

  <frameset rows="160,*">

    <frame src="frame.htm" name="topFrame">

    <frameset cols="50%,50%">

      <frame src="anotherframe.htm" name="leftFrame">

      <frame src="yetanotherframe.htm" name="rightFrame">

    </frameset>

  </frameset>

</html>

在上面有三个框架，其中一个框架居上，两个框架在下面，可以通过window.frames[0]或者window.frames[“topFrame”]来引用上方的框架。当然最常用的还是用top对象来引用，即top.frames[0]的结果为topFrame。top对象始终指向的是最高最外层框架，即浏览器窗口。

与top对象对应的就是parent对象，parent对象始终指向当前框架的直接上层框架。在没有框架的情况下top=parent=window.

yetanotherframe.html内容如下

<html>

<head>

<title>Frameset Example</title>

</head>

<frameset cols="50%,50%">

<frame src="red.htm" name="redFrame">

<frame src="blue.htm" name="blueFrame">

</frameset>

</html>

如果代码位于red.html或者blue.html中的话，parent对象指的就是rightFrame框架。

最后一个对象就是self，它始终指向的是window对象，可以和window对象互换使用。

这些对象都是window对象的属性，可以通过window.parent等来访问。

在使用框架的情况下，浏览器中会存在多个Global对象，每个框架中定义的全局变量和方法会成为框架中的window的属性和方法

3、导航和打开窗口

window.open()方法既可以导航到一个特定的url，同时也可以打开一个新的浏览器窗口。该方法可以接受4个参数，分别为要加载的url，窗口目标，一个特性字符串和一个表示新页面是否取代浏览器历史中当前加载页面的布尔值。通常只需传递一个参数。

window.open("http://www.baidu.com");

这行代码会在浏览器新打开一个标签页，转到其中的url

如果添加了第二个参数，而且该参数是已存在的窗口或者框架的名称，那么就会在该窗口打开这个url；如果该参数不是已存在的窗口或者框架的名称，那么就会创建一个新的窗口或者框架用来打开其中的url。一般情况下打开的是框架，在Chrome中打开的是一个新标签页。

如果window.open()接收了三个参数，如果第二个参数不是一个已存在的窗口或者框架，那么就会根据第三个参数位置上传入的字符串来创建一个新的窗口或者标签页。

第三个参数是一个以逗号分隔的字符串，例如“height=400,width=300”,用来确定新窗口的大小。

可以出现在该字符串位置的选项如下：

设置 值 说明
fullscreen yes或no 表示浏览器窗口是否最大化，仅限于IE
height number数值 表示新窗口的高度，>=100
width number数值 表示新窗口的宽度，>=100
left number数值 表示窗口的左坐标，>=0
location yes或no 表示是否在浏览器窗口显示地址栏
resizable yes或no 表示是否允许拖动边缘来更改窗口的大小

在下面的代码中会新建一个名为newWindow窗口，窗口的初始大小为400*400，可以调整大小

window.open("http://www.baidu.com","newWindow","height=400,width=400,top=10,left=10,resizable=yes");

window.open()方法会返回一个指向新窗口的引用，引用的对象和其他window对象大致相似，但是可以对其进行更多的控制。

弹出窗口屏蔽程：大多数程序都有弹出窗口屏蔽程序，而没有内置此类程序的浏览器，也可以安装Yahoo，Toolbar等带有内置屏蔽程序的实用工具。因此弹出窗口被屏蔽是就有两种情况，一如果是被浏览器内置窗口屏蔽的，那么window.open()函数很可能返回null，只要检测这个返回的值是否null就可以判断窗口是否被屏蔽。

如果是被浏览器扩展或者其他程序阻止的弹出窗口，那么window.open()通常会抛出一个异常。因此要想准确判断出弹出窗口是否被屏蔽，必须在检测返回值的同时将其封装在try，，，catch中

blocked=false;

      try

      {

        var win=window.open("http://www.baidu.com","newWindow","height=400,width=400,top=10,left=10,resizable=yes");

        if (win==null) {

          blocked=true;

        }

      }catch(ex)

      {

        blocked=true;

      }

      if (blocked) {

        alert("the popup was blocked");

      }

4、间歇调用和超时调用

javascript是单线程 语言，可以通过设置超时值和间歇时间值来调度代码在特定的时间时刻调用。前者是指在指定的时间过后执行代码，后者是每个指定的时间就调用一次代码

超时调用需要调用window的setTimeout方法，它接收两个参数：要执行的代码和毫秒表示的时间。其中第一个参数可以使包含javascript代码的字符串（和eval的参数相同），也可以是一个函数。

setTimeout(function(){

        alert("hello,world!");

      },5000);

第二个参数表示再经过多长时间将该任务加入到执行队列中，如果队列为空则立即执行，否则等队列中的任务执行完在执行。

调用setTimeout方法后会返回一个数值ID，将该数值作为参数赋给clearTimeout(ID)，就可以在时间未过之前将超时调用完全取消。

间歇调用和超时调用类似，不过该方法会在指定的时间重复执行代码，直至间歇调用被取消或者页面被卸载。设置间歇调用的方法为setInterval()和setTimeout方法的参数相同，取消间歇调用clearInterval()方法，和cleatTimeout()参数完全相同。

5、系统对话框

浏览器通过调用alert(),confirm(),prompt()方法看，可以调用系统对话框向用户显示消息。系统对话框和浏览器显示的网页没有关系。

javascript之BOM对象（一window对象）的更多相关文章

  1. JavaScript（4）——闭包与this对象以及window对象

    闭包与this对象以及window对象 这次写的是这三个内容.其实在写之前,会觉得这三个内容很多,但是写了之后会发现,内容确实很多,但是可以写出来的也并不是很多.可能是我总结能力太差.但是这些内容我觉 ...

  2. JavaScript中的global对象，window对象以及document对象的区别和联系

    JavaScript中的global对象,window对象以及document对象的区别和联系 一.概念区分:JavaScript中的global对象,window对象以及document对象 1.g ...

  3. DOM对象和window对象

    本文内容: DOM对象 Window 对象 首发日期:2018-05-11 DOM对象: DOM对象主要指代网页内的标签[包括整个网页] 比如:document代表整个 HTML 文档,用来访问页面中 ...

  4. JavaScript浏览器对象模型（BOM）之window对象

    一.BOM概述 BOM(Browser Object Model)浏览器对象模型,它提供了很多对象,用于访问浏览器的功能. BOM 缺少规范,每个浏览器提供商又按照自己想法去扩展它,那么浏览器共有对象 ...

  5. JavaScript (JS)基础：BOM 浅析 (含window对象相关基本方法、属性解析)

    ① window对象(Math方法也属于window对象): window对象是JavaScript中的顶级对象,所有定义在全局作用域中的变量.函数都会变成window对象的属性和方法,window对 ...

  6. 《Javascript权威指南》学习笔记之十五：BOM之源---window对象

    BOM是Browser Object Model的缩写,即浏览器对象模型,提供了独立于网页内容和浏览器窗体之间进行交互的APi.API由若干对象组成,因为浏览器是Javascript的宿主,因此,这些 ...

  7. 第8章 浏览器对象模型BOM 8.1 window对象

    ECMAScript是javascript的核心,但如果要在web中使用javascript,那么BOM(浏览器对象模型)则无疑是真正的核心.BOM提供了很多对象,用于访问浏览器的功能,在浏览器之间共 ...

  8. javascript知识点之DOM与window对象

    在学习javascript过程中只是一知半解好多,碰到自己不知道属性方法,到最后都不知道自己学到了什么 js代码为什么这样写 为什么你知道这方法或属性可以这样用. DOM和window对象 DOM基本 ...

  9. BOM元素之window对象

    在浏览器中,window对象有双重角色,它既是通过JavaScript访问浏览器窗口的一个接口,又是ECMAScript规定的Global对象.这意味着在网页中定义的任何一个对象.变量和函数,都以wi ...

  10. JavaScript 学习（1）--window对象

    JavaScript 学习--Window对象 window对象方法 1.1 创建新窗体 //窗体打开 var newWindow=Window.open("default.html&quo ...

随机推荐

  1. MySql5.7InnoDB全文索引（针对中文搜索）

    1.ngram and MeCab full-text parser plugins 全文检索在MySQL里面很早就支持了,只不过一直以来只支持英文.缘由是他从来都使用空格来作为分词的分隔符,而对于中 ...

  2. Zabbix介绍及安装

    Zabbix简介 Zabbix是一款能够监控各种网络参数以及服务器健康性和完整性的软件,是一个企业级的分布式开源监控方案.Zabbix使用灵活的通知机制,允许用户为几乎任何事件配置基于邮件的告警.这样 ...

  3. [LeetCode] 892. Surface Area of 3D Shapes 三维物体的表面积

    On a N * N grid, we place some 1 * 1 * 1 cubes. Each value v = grid[i][j] represents a tower of v cu ...

  4. 【报名中】【5G探索】深度揭秘5G核心技术与挑战，云+社区开发者大会北京站等你来！

    报名渠道(扫描下方二维码) 开发者专属福利 限量手办 现场幸运签到开发者即可获得,早到获奖几率更大 幸运抽奖 一等奖:1名 JBL LIVE650 BTNC无线主动降噪智能耳机 二等奖:3名 JBL ...

  5. 微信企业号消息接口PHP SDK

    微信企业号消息接口PHP SDK及Demo <?php /* 方倍工作室 http://www.fangbei.org/ CopyRight 2015 All Rights Reserved * ...

  6. 用欧拉计划学Rust语言（第7~12题）

    最近想学习Libra数字货币的MOVE语言,发现它是用Rust编写的,所以先补一下Rust的基础知识.学习了一段时间,发现Rust的学习曲线非常陡峭,不过仍有快速入门的办法. 学习任何一项技能最怕没有 ...

  7. （九）golang--标识符的命名规则

    标识符的概念: (1)各种变量.方法等命名时使用的字符序列被称为标识符: (2)凡是可以自己起名字的都可以叫标识符: 标识符的命名规则: (1)由26个英文字母大小写,0-9,_组成 (2)数字不可以 ...

  8. python数据分析开发中的常用整理

    Pandas操作 python使用pandas读取csv import pandas as pd #数据筛选 usetTable = pd.read_csv(filename,header = 0) ...

  9. 明解C语言 入门篇 第九章答案

    练习9-1 /* 将字符串存储在数组中并显示(其2:初始化) */ #include <stdio.h> int main(void) { char str[] = "ABC\0 ...

  10. 如何同时在Isilon的所有网卡上抓取网络包？

    命令行如下: cd /ifs/data/Isilon_Support/ mkdir $(date +%m%d%Y) isi_for_array 'for i in `ifconfig | grep - ...