JavaScript DOM和BOM

JavaScript组成

JavaScript和ECMAScript通常都被人们用来表达相同的含义，但JavaScript的含义却比ECMA-262中规定的要多得多。

一个运行在的JavaScript实现应该由下列三个不同的部分组成:

1、核心( ECMAScript)：JavaScript语言的核心，包含基本语法、数据类型、关键字...

2、文档对象模型( DOM)：提供访问和操作网页内容的方法和接口；可操作HTML中的标签内容、样式、结构；
document.write(“你好”)，输出内容至网页，这就是DOM中方法。
3、浏览器对象模型( BOM)：提供与浏览器交互的方法和接口。可操作浏览器窗口，
比如浏览器地址栏，浏览器访问历史等；
window.alert(“你好”);，浏览器弹出一个消息对话框，这就是BOM中的方法。

DOM和BOM

 

DOM:文档对象模型,主要是操作是HTML中标签；

BOM:浏览器对象模型,主要是操作的浏览器窗口；

DOM(Document Object Model)即文档对象模型使JavaScript有能力与HTML 文档的所有元素“对话”。

BOM(Browser Object Model)即浏览器对象模型使 JavaScript 有能力与浏览器“对话”。

BOM提供了访问浏览器各种功能部件的途径，例如浏览器窗口本身、浏览历史等；而DOM提供了访问浏览器中网页文档各元素的途径，包括页面中的超链接、表单等各种HTML元素及其内容。

BOM与DOM是独立于程序语言和平台的标准，W3C定义了一组标准接口，而这些接口在浏览器中以对象的形式实现。BOM与DOM均由一组对象组成，对象定义了属性和方法。

BOM与DOM关系非常密切。BOM的window对象中包含一个document属性，该属性是对DOM模型的document对象的引用，代表了当前窗口中网页文档所对应的document对象，通过该属性可以访问网页文档的各种内容。

为什么要学习BOM和DOM

1. 弹出新的浏览器窗口、移动、关闭浏览器窗口及调整窗口大小；
2. 提供WEB浏览器详细信息的导航对象；
3. 提供装载到浏览器中页面的详细信息的定位对象；
4. 提供用户屏幕分辩率详细信息的屏幕对象；
5. 对cookie的支持。 等等

通过DOM对象完成以下内容:

使得程序的脚本可以动态地访问并更新页面的内容，结构以及样式，文档可以被进一步加工处理并且处理结果可以显示在当前页面上. 如当当网的事例,已经所有网页上的动态效果(除flash外).

BOM模型对象结构图

BOM并不是只有一个对象而是有以下对象组成的.

 BOM结构图说明:

1.反映了BOM中各对象之间的层次关系；
2.在BOM中，window对象是顶层对象，其它对象均是其子对象；
3.history浏览器的浏览历史
4.location对象代表当前显示的文档的地址
5.Navigator对象提供有关浏览器的各种信息
6.screen对象提供显示器屏幕相关的一些信息
7.Frames[]为window对象的数组型属性，每一个数组元素对应框架集(frameset)
中的一个框架(frame)所对应的窗口。
8.Document对象是对DOM的引用，代表了当前浏览器窗口中的网页文档