BOM浏览器对象模型

最新推荐文章于 2023-03-25 20:59:16 发布

程序帝国

最新推荐文章于 2023-03-25 20:59:16 发布

阅读量160

点赞数

分类专栏： web学习进程复习题目文章标签： BOM BOM对象模型

web学习进程复习题目专栏收录该内容

9 篇文章 0 订阅

订阅专栏

BOM浏览器对象模型

访问和操作浏览器窗口的模型称为浏览器对象模型BOM（Browser Object Model）。
BOM整体对象图。
在这里插入图片描述
核心是window对象；

以下有特殊双重身份：

window对象既是ECMAScript规范中的Global对象，也是BOM中的顶级对象；

document对象既是BOM顶级对象的一个属性，也是DOM模型中的顶级对象

location对象既是window对象的属性，同时也是document对象的属性。

window对象（从两个方面看待：ECMAScript规范中的Global对象，也是BOM中的顶级对象）

1.1 window作为ECMAScript中的Global对象

1_引用window对象的属性和方法时，可以省略window。（就像Globle对象一样）

2_在全局作用域中this和window指向同一个对象，另外，还可以使用self来引用window对象，全等关系即：this=window=self。

3_在全局作用域中定义的变量和函数也会成为window对象的属性和方法，但是和直接在window对象上定义属性还是有区别：

a、全局变量不能使用delete删除（相当于给window定义属性时将属性特性[[Configurable]]赋值为false了），

直接在window对象上定义的属性可以使用delete删除（直接定义window对象时属性特性[[Configurable]]赋值默认为true）。

如果同时定义了全局变量和window对象的属性，则删除window属性时不起作用。

b、尝试访问未定义的全局变量会抛出异常，但是访问未定义的window对象的属性则只是返回undefined。(这里可以很好地利用此特性进行检测兼容性）

var name = 'Games';                               //全局作用域中定义的变量和函数会成为window对象的属性和方法，但是不能使用delete删除
function getName(){
    return this.name;
}
console.info(window.name);                       // Games
console.info(window.getName());                  // Games
console.info(this == window);                    // true
console.info(this == self);                      //  true
console.info(window == self);                    // true

window.name = 'Kobe';                            //直接在window对象上定义属性，会同时修改全局变量的值，相反，修改全局变量的值，window对象的属性值也会修改
console.info(name);
delete window.name;                              //既定义了全局变量，又在window对象上定义了属性，删除时虽然没有报错，但是并没有起作用
console.info(name);                              //Kobe
console.info(window.name);                       //Kobe

window.team = 'cavs';                            //直接在window对象上定义属性，可以使用delete删除
console.info(window.team);
delete window.color;
console.info(window.color);                      //undefined

1.2 window作为BOM中的顶级对象

1.2.1 浏览器整个窗口与框架

没有子框架时：window、self、top和parent都相等，都是指最顶层框架，即浏览器窗口。

有子框架时：window、self 和 top 都为最顶层框架，parent指向当前框架的直接上层框架.

如果页面中包含框架，则每个框架都有自己的window对象，并且保存在父窗口的frames集合中.

可以通过索引（从0开始，从左至右，从上至下）或者框架名称name属性访问相应的window对象。每个window对象都有一个name属性，表示所处框架的名称。

//下面是一个包括框架的页面<html>
<head>
    <title>Window</title>
</head>
<frameset rows="160,*">
    <frame src="frame.htm" name="topFrame">
    <frameset cols="50%,50%">
        <frame src="leftrframe.htm" name="leftFrame">
        <frame src="rightrframe.htm" name="rightFrame">
    </frameset>
</frameset>
</html>

在这里插入图片描述

信息来源于网络—由“程序帝国”摘录转载

原文：BOM浏览器对象模型

程序帝国

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
BOM浏览器对象模型

BOM浏览器对象模型访问和操作浏览器窗口的模型称为浏览器对象模型BOM（Browser Object Model）。BOM整体对象图。核心是window对象；以下有特殊双重身份：window对象既是ECMAScript规范中的Global对象，也是BOM中的顶级对象；document对象既是BOM顶级对象的一个属性，也是DOM模型中的顶级对象location对象既是window对象...
复制链接

扫一扫