[转] JavaScript学习:BOM和DOM的区别和关联

BOM

1.  BOM是Browser Object Model的缩写,即浏览器对象模型

2.  BOM没有相关标准。

3.  BOM的最根本对象是window。

从1可以看出来:BOM和浏览器关系密切。浏览器的很多东西可以通过JavaScript控制的,例如打开新窗口、打开新选项卡(标签页)、关闭页面,把网页设为主页,或加入收藏夹,等等…这些涉及到的对象就是BOM。

从2可以看出来:由于没有标准,不同的浏览器实现同一功能,可以需要不同的实现方式。对于上面说的功能,不同的浏览器的实现功能所需要的JavaScript代码可能不相同。

例如加入收藏夹这么一个功能:
IE浏览器: window.external.AddFavorite(url,title);

FireFox浏览器: window.sidebar.addPanel(title, url, "");

所以在写这一块的JavaScript代码时,就要考虑浏览器兼容性了。

虽然BOM没有一套标准,但是各个浏览器的常用功能的JavaScript代码还是大同小异的,对于常用的功能实际上已经有默认的标准了。所以不用过于担心浏览器兼容问题,不是每个浏览器都有自己的BOM,也不需要为每个浏览器都学习一套BOM,只是个别浏览器会有新增的功能会在BOM上体现出来。

DOM

1.      DOM是Document Object Model的缩写,即文档对象模型

2.      DOM是W3C的标准。

3.      DOM最根本对象是document(实际上是window.document)。

从1可以看出来:DOM和文档有关,这里的文档指的是网页,也就是HTML文档。网页是由服务器发送给客户端浏览器的,无论用什么浏览器,接收到的HTML都是一样的,所以DOM和浏览器无关,它关注的是网页本身的内容。由于和浏览器关系不大,所以标准就好定了。

既然有标准了,大家就要按标准来了,不按标准来的浏览器就要打屁股了。

那么JavaScript的DOM是干什么的呢?

我们知道HTML是由标签组成的,标签套标签。JavaScript可以通过DOM获取到底有哪些标签,标签里面的属性是什么,内容是什么等等…

从3中window.document已然可以看出,DOM的最根本的对象是BOM的window对象的子对象。

图片转自:http://www.dreamdu.com/

上图很好的说明的二者之间的关系:两者的关系是BOM包含DOM

作者:叉叉哥   转载请注明出处:http://blog.csdn.net/xiao__gui/article/details/8315148

时间: 2024-10-06 00:11:09

[转] JavaScript学习:BOM和DOM的区别和关联的相关文章

BOM和DOM的区别和关联

BOM 1. BOM是Browser Object Model的缩写,即浏览器对象模型. 2. BOM没有相关标准. 3. BOM的最根本对象是window. 从1可以看出来:BOM和浏览器关系密切.浏览器的很多东西可以通过JavaScript控制的,例如打开新窗口.打开新选项卡(标签页).关闭页面,把网页设为主页,或加入收藏夹,等等…这些涉及到的对象就是BOM. 从2可以看出来:由于没有标准,不同的浏览器实现同一功能,可以需要不同的实现方式.对于上面说的功能,不同的浏览器的实现功能所需要的Ja

【JavaScript】BOM和DOM

在第一篇JavaScript视频总结博客中,是对JavaScript做了一个宏观的认识.其中,不知道大家可否还记得,JavaScript的核心部分包括哪些? JavaScript的核心部分主要包括三个: 1.ECMAScript,如果想更多了解它,不妨看看百度. 2.BOM(Browser Object Model)(浏览器对象模型) 3.DOM(Document Object Model )(文本对象模型) 本篇博客主要是对后面两个核心部分做个简单总结,两者看起来相似,其实有着完全不一样的作用

BOM和DOM的区别

首先,如果你来查这个问题了,证明你便是个热爱学习的人,其次我也是. BOM 浏览器对象模型,无过于是提供一系列的对象,便于我们进行浏览器的操作,所以BOM的范畴很大. 而DOM其实算是BOM浏览器下的一个子对象,因为文档操作也属于浏览器操作的范畴,因为文档操作过于 重要,所以单独将DOM拿过来进行了介绍,至于他们的区别,其实就不必过分追究了,其实就是相当于一个 学校有若干个学院,但是某个学院十分出色,所以单独介绍了该学院,仅此而已,再过分追究不再有意义,毕竟 我们都是应用型人才.

JavaScript学习 八、DOM扩展

对DOM的两个主要扩展是Selectors API(选择符API)和HTML5.这两个扩展都是源自开发社区.此外还有一个不那么因为瞩目的ELement Traversal(元素遍历)规范.为DOM添加了一些属性. 选择符API 众多JavaScript 库中最常用的一项功能,就是根据CSS选择符选择与某个模式匹配的DOM元素. 实际上 jQuery 的核心就是通过CSS选择符查询DOM 文档取得元素的引用,从而抛开了 getElementById() 和 getElementsByTagName

理解JavaScript中BOM和DOM的关系

JavaScript 有三部分构成,ECMAScript,DOM和BOM,根据宿主(浏览器)的不同,具体的表现形式也不尽相同,ie和其他的浏览器风格迥异.对象是JavaScript是重要API,包含内置对象.外部对象(window对象.dom对象)和自定义对象. 1.BOM全称Browser Object Model,即浏览器对象模型,主要处理浏览器窗口和框架. 2.DOM全称Document Object Model,即文档对象模型,是 HTML 和XML 的应用程序接口(API),遵循W3C

javascript之BOM、DOM部分系列

[1]BOM [1.1]BOM之window对象 [1.2]BOM之location对象 [1.3]BOM之navigator.history.screen对象 [2]DOM [2.1]DOM节点类型 [2.1.1]DOM元素节点ELEMENT [2.1.2]DOM特性节点ATTRIBUTE [2.1.3]DOM文档节点DOCUMENT [2.1.4]DOM文本节点TEXT [2.1.5]DOM注释节点COMMENT [2.1.6]DOM节点之DocumentType类型.DocumentFra

JavaScript学习 七、DOM

DOM(文档对象模型)是针对HTML和XML文档的一个API.DOM描绘了一个层次化的节点树.允许开发人员添加.移除.修改页面的某一部分. 节点层次 文档节点是每个文档的根节点,文档元素是文档的最外层元素,文档中其他说有的元素都包含在文档元素中,每个文档只能有一个文档元素,在HTML 中,文档元素始终是<html> 元素,在XML 中没有预定义的元素,因此任何元素都可能成为文档元素. 每一段标记都可以通过树中的一个节点来表示:HTML 元素通过元素节点表示,特性(attribute)通过特性节

BOM与DOM的区别

BOM中的对象 Window对象: 是整个BOM的核心,所有对象和集合都以某种方式回接到window对象.Window对象表示整个浏览器窗口,但不必表示其中包含的内容. Document对象: 实际上是window对象的属性.这个对象的独特之处是唯一一个既属于BOM又属于DOM的对象.从BOM角度看,document对象由一系列集合构成,这些集合可以访问文档的各个部分. Location对象: 它是window对象和document对象的属性.Location对象表示载入窗口的URL,此外它还可

JavaScript学习——BOM对象

1.BOM 对象:浏览器对象模型(操作与浏览器相关的内容) 2.Window 对象 Window 对象表示浏览器中打开的窗口 setInterval():它有一个返回值,主要是提供给 clearInterval 使用 setTimeout():它有一个返回值,主要是提供给 clearTimeout 使用 clearInterval():该方法只能清除由 setInterval 设置的定时操作 clearTimeout():该方法只能清除由 setTimeout 设置的定时操作 弹出框的几个方法: