当前位置: 首页 > news >正文

BOM与DOM(解疑document window关系)

在这里插入图片描述

BOM(浏览器对象模型)

定义与作用
BOM(Browser Object Model)提供与浏览器窗口交互的接口,用于控制导航、窗口尺寸、历史记录等浏览器行为

window:浏览器窗口的顶层对象,包含全局属性和方法(如 alert())

BOM的核心对象是window,而DOM的核心对象document是window的一个属性。通过window.document可以直接访问DOM的根节点,这表明DOM在结构上是BOM的子集

DOM(文档对象模型)

定义与作用
DOM(Document Object Model)是用于操作 HTML/XML 文档的编程接口,它将网页内容解析为树状结构(DOM树),允许开发者通过 JavaScript 动态访问和修改页面元素、属性、样式及事件等

核心对象:document 是 DOM 的入口,代表整个 HTML 文档

节点类型:
元素节点(如

)、文本节点(元素内的文本)、属性节点(如 class)等
在这里插入图片描述

alert()、,实际是调用window.alert()、
**// 直接访问 document
document.getElementById(“content”);

// 等价于通过 window 访问
window.document.getElementById(“content”);

BOM 的组成部分: console 是浏览器对象模型(BOM)提供的调试工具接口,而 BOM 的核心对象是 window,因此 console 作为浏览器功能的一部分,自然挂载在 window 下。
全局作用域的体现: window 是浏览器中的全局作用域对象,所有浏览器提供的全局 API(如 document,console)均是其属性
window.alert(…) 警告框
document.write(…) 在HTML 输出内容
console.log(…) 写入浏览器控制台
没有写window的其实默认有
原因,window 是全局对象 在浏览器环境中,window 是 JavaScript 的全局对象,所有全局作用域下的变量、函数和内置方法均属于 window 的属性或方法 。

相关文章:

  • 看一看 中间件Middleware
  • JVM性能优化之老年代参数设置
  • 【前端】手写代码输出题易错点汇总
  • git检查提交分支和package.json的version版本是否一致
  • 使用vue2开发一个医疗预约挂号平台-前端静态网站项目练习
  • ASP.NET MVC​ 入门指南
  • JAVA设计模式——(六)装饰模式(Decorator Pattern)
  • 建造者模式:分步构建复杂对象的设计模式
  • 罗伯·派克:Go语言创始者的极客人生
  • 【项目管理】进度网络图 笔记
  • Vue 2 的响应式 API 和 Vue 3 的组合式 API 的详细对比,从核心机制、使用方式、代码示例及优缺点展开
  • Linux:git和gdb/cgdb
  • 多线程(线程安全)
  • MacOS上如何运行内网穿透详细教程
  • Puter部署指南:基于Docker的多功能个人云平台掌控自己的数据
  • 《Pinia 从入门到精通》Vue 3 官方状态管理 -- 进阶使用篇
  • 音视频之H.265/HEVC量化
  • Streamlit从入门到精通:构建数据应用的利器
  • CGAL 网格等高线计算
  • 参考文献新国标GB/T 7714-2025的 biblatex 实现
  • 胃病、闭经、湿疹、失明:藏在疾病后的情绪问题
  • 孙燕姿演唱会本周末开唱,小票根如何在上海释放大活力
  • A股三大股指涨跌互现,工农中三大行股价创新高
  • 张又侠董军分别与印尼国防部长会见会谈
  • 新质生产力的宜昌解法:抢滩“高智绿”新赛道,化工产品一克卖数千元
  • 全总:五一拟表彰全国劳模先进工作者2426名,盛李豪入选