6st DOM与BOM

Posted 2021-01-15 ferryj

DOM简介：

DOM 是 W3C（万维网联盟）的标准，是 Document Object Model（文档对象模型）的缩写。

DOM 定义了访问 html 和 XML 文档的标准：

“W3C 文档对象模型 （DOM） 是中立于平台和语言的接口，它允许程序和脚本动态地访问和更新文档的内容、结构和样式。”

W3C DOM 标准被分为 3 个不同的部分：

• 核心 DOM - 针对任何结构化文档的标准模型
• XML DOM - 针对 XML 文档的标准模型
• HTML DOM - 针对 HTML 文档的标准模型

 

Contact:

HTML DOM 定义了所有 HTML 元素的对象和属性，以及访问它们的方法。换言之HTML DOM 是关于如何获取、修改、添加或删除 HTML 元素的标准。

 

 

DOM 对象method：

方法		描述
getElementById()	返回带有指定 ID 的元素。
getElementsByTagName()		返回包含带有指定标签名称的所有元素的节点列表（集合/节点数组）。
getElementsByClassName()		返回包含带有指定类名的所有元素的节点列表。
appendChild()		把新的子节点添加到指定节点。
removeChild()		删除子节点。
replaceChild()		替换子节点。
insertBefore()		在指定的子节点前面插入新的子节点。
createAttribute()		创建属性节点。
createElement()		创建元素节点。
createTextNode()		创建文本节点。
getAttribute()		返回指定的属性值。
setAttribute()		把指定属性设置或修改为指定的值。

BOM简介：    

BOM（Browser Object Model）即浏览器对象模型。

BOM提供了独立于内容 而与浏览器窗口进行交互的对象,浏览器对象模型 (BOM) 使 javascript 有能力与浏览器“对话”。

由于BOM主要用于管理窗口与窗口之间的通讯，因此其核心对象是window；

BOM由一系列相关的对象构成，并且每个对象都提供了很多方法与属性. 可以移动、调整浏览器大小的window对象，可以用于导航的location对象与history对象，可以获取浏览器、操作系统与用户屏幕信息的navigator与screen对象，可以使用document作为访问HTML文档的入口，管理框架的frames对象等

 

 

Method:

window对象：所有浏览器都支持 window 对象。它表示浏览器窗口。所有 JavaScript 全局对象、函数以及变量均自动成为 window 对象的成员。全局变量是 window 对象的属性。函数是 window 对象的方法。

属性：
　status：状态栏(目前浏览器已弃用了）

　opener：即谁打开我的，若在A用open打开B则B的opener就是A

　closed：判断子窗体是否关闭

方法：
alert()  弹出框

　confirm() 带确认,取消弹出框

　setInterval() 每隔多少秒调用一次

　clearInterval() 清除setInterval

　setTimeout() 隔多少秒调用一次

　cleartimeout() 清除setTimeout

　open() 打开一个新的窗口

 

 

 

Contact:

BOM缺乏标准，JavaScript语法的标准化组织是ECMA，DOM的标准化组织是W3C，BOM最初是Netscape浏览器标准的一部分。

javacsript是通过访问BOM（Browser Object Model）对象来访问、控制、修改客户端(浏览器)，由于BOM的window包含了document，window对象的属性和方法是直接可以使用而且被感知的，因此可以直接使用window对象的document属性，通过document属性就可以访问、检索、修改XHTML文档内容与结构。因为document对象又是DOM（Document Object Model）模型的根节点。可以说，BOM包含了DOM(对象)，浏览器提供出来给予访问的是BOM对象，从BOM对象再访问到DOM对象，从而js可以操作浏览器以及浏览器读取到的文档。

其中DOM包含：window

1 2 3

Window对象包含属性：document、location、navigator、screen、history、frames   Document根节点包含子节点：forms、location、anchors、images、links

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

 

 

区别：

DOM描述了处理网页内容的方法和接口，BOM描述了与浏览器进行交互的方法和接口