美文网首页
[其他]document,window,DOM,BOM的区别

[其他]document,window,DOM,BOM的区别

作者: 豆板儿 | 来源:发表于2017-11-25 13:48 被阅读18次

document,window,DOM,BOM的区别

DOM

DOM 全称是 Document Object Model,也就是文档对象模型

DOM 就是针对HTML和XML提供的一个API。为了能以编程的方法操作这个HTML的内容(比如添加某一个元素,修改元素的内容,删除某些元素)。我们把整个HTML看做一个对象树,它里面包括的所有东西都可以看做对象。例如<div></div>这样的标签就是一个节点(node)。

document

当浏览器下载了一个网页,通常都是html,这个html就是document(也是DOM树的一个node),document通常是整个DOM树的根节点。
document 包含了标题(document.title)、URL(document.URL)等属性,可以直接在 JS 中访问到。

document对象.png

例如,通过 iframe 加载的页面,每一个都是一个 document。在 JS 中,可以通过 document 访问其子节点(其实任何节点都可以),如

document.body;
document.getElementById('xxx');
document.title;

BOM

BOM 是 Browser Object Model,浏览器对象模型。

BOM 为了能控制浏览器的行为出现的接口比如跳转到另一个页面、前进、后退等等,程序还可能需要获取屏幕的大小之类的参数。我们把整个HTML看做一个对象树,它里面包括的所有东西都可以看做对象。例如<div></div>这样的标签就是一个节点(node)。
所以 BOM 就是为了解决这些事情出现的接口。比如我们要让浏览器跳转到另一个页面,只需要

location.href = "http://www.xxxx.com";

location 就是 BOM 里的一个对象。

window

window 也是 BOM 的一个对象,除去编程意义上的“兜底对象”之外,通过这个对象可以获取窗口位置、确定窗口大小、弹出对话框等等。例如我要关闭当前窗口:

window.close();

参考文章:

https://www.zhihu.com/question/33453164/answer/56549408

相关文章

网友评论

      本文标题:[其他]document,window,DOM,BOM的区别

      本文链接:https://www.haomeiwen.com/subject/dpkcbxtx.html