DOM和BOM

DOM

文档对象模型,包括document本身和页面上的各种标签元素。DOM是访问和控制文档及标签元素的API,通过DOM可以查找、修改、添加、删除标签元素,还可以添加事件监听函数以响应页面上的各种事件。H5新增了一些DOM API(如querySelector)在一程度上增强了DOM,但实际开发中,使用jQuery进行开发还是非常普遍的。因为jQuery不仅提供了强大的DOM操作能力,而且能够解决浏览器兼容性问题。此外jQuery还提供了Ajax请求、动画等实用功能,还提供了CallbacksDeferred等高级API。

 

BOM

浏览器对象模型,包括window、locationhistory、navigator等

window对象是全局作用域,window对象会随页面的加载或刷新而重置,即全局作用域生命周期相关的内容都会被销毁。window对象提供了窗口相关的API,用于控制窗口及窗口与窗口之间的关系。window对象还提供了XHR、setTimeoutalertWebWorker等各种编程接口和功能支持。实际上从window对象出发可以访问几乎所有的Web API。

location提供了与url相关的API,通过location提供的属性可以获取url的各个组成部分。location还提供了对页面进行导航控制的基本功能,如对href赋值、assign()reload()replace()方法等。值得注意的是location提供了hashchange事件,可以监听hash fragment的变化,这对于单页Web应用中的路由机制提供了重要的支持。

history对象提供了浏览历史记录控制功能,如back()、forward()go()等,H5还新增了状态相关的API:state、pushStatereplaceState配合windowpopstate事件可以为路由机制提供重要的支持。

navigator对象提供了浏览器和操作系统信息的描述,如userAgentH5还在navigator中加入了很多设备访问功能,如geolocation、battery、vibrate等(浏览器目前支持不太好)。

posted @   刘兵博客  阅读(130)  评论(0编辑  收藏  举报
编辑推荐:
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
阅读排行:
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· 阿里巴巴 QwQ-32B真的超越了 DeepSeek R-1吗?
· 【译】Visual Studio 中新的强大生产力特性
· 10年+ .NET Coder 心语 ── 封装的思维:从隐藏、稳定开始理解其本质意义
· 【设计模式】告别冗长if-else语句:使用策略模式优化代码结构
点击右上角即可分享
微信分享提示