JavaScript BOM 浏览器对象模型

简介: JavaScript BOM 浏览器对象模型

BOM,即浏览器对象模型,提供了与浏览器交互的对象。这些对象包括窗口(Window)、导航器(Navigator)、位置(Location)、历史记录(History)等。以下是一些关于JavaScript BOM的详细代码示例:

1.窗口对象

javascript// 获取窗口的宽度和高度
var width = window.innerWidth;
var height = window.innerHeight;
 
// 获取浏览器窗口的滚动条位置
var scrollX = window.pageXOffset;
var scrollY = window.pageYOffset;
 
// 打开新窗口
window.open('http://www.example.com', '_blank');

2.导航器对象

javascript// 获取当前页面的URL
var currentURL = window.location.href;
 
// 获取URL的路径名、查询字符串等部分
var pathname = window.location.pathname;
var search = window.location.search;

3.位置对象

javascript// 获取当前页面的URL
var currentURL = window.location.href;
 
// 获取URL的路径名、查询字符串等部分
var pathname = window.location.pathname;
var search = window.location.search;

4.历史对象

javascript// 前进到历史记录中的下一页
window.history.forward();
 
// 回到历史记录中的前一页
window.history.back();

5.屏幕对象

javascript// 获取屏幕的宽度和高度
var screenWidth = screen.width;
var screenHeight = screen.height;

6.事件处理

javascript// 添加事件监听器,例如点击事件
document.getElementById('myButton').addEventListener('click', function() {
alert('按钮被点击了!');
});


相关文章
|
1月前
|
存储 人工智能 前端开发
前端大模型应用笔记(三):Vue3+Antdv+transformers+本地模型实现浏览器端侧增强搜索
本文介绍了一个纯前端实现的增强列表搜索应用,通过使用Transformer模型,实现了更智能的搜索功能,如使用“番茄”可以搜索到“西红柿”。项目基于Vue3和Ant Design Vue,使用了Xenova的bge-base-zh-v1.5模型。文章详细介绍了从环境搭建、数据准备到具体实现的全过程,并展示了实际效果和待改进点。
137 2
|
18天前
|
缓存 JavaScript UED
js中BOM中的方法
【10月更文挑战第31天】
|
20天前
|
JSON 移动开发 JavaScript
在浏览器执行js脚本的两种方式
【10月更文挑战第20天】本文介绍了在浏览器中执行HTTP请求的两种方式:`fetch`和`XMLHttpRequest`。`fetch`支持GET和POST请求,返回Promise对象,可以方便地处理异步操作。`XMLHttpRequest`则通过回调函数处理请求结果,适用于需要兼容旧浏览器的场景。文中还提供了具体的代码示例。
在浏览器执行js脚本的两种方式
|
18天前
|
机器学习/深度学习 自然语言处理 前端开发
前端神经网络入门:Brain.js - 详细介绍和对比不同的实现 - CNN、RNN、DNN、FFNN -无需准备环境打开浏览器即可测试运行-支持WebGPU加速
本文介绍了如何使用 JavaScript 神经网络库 **Brain.js** 实现不同类型的神经网络,包括前馈神经网络(FFNN)、深度神经网络(DNN)和循环神经网络(RNN)。通过简单的示例和代码,帮助前端开发者快速入门并理解神经网络的基本概念。文章还对比了各类神经网络的特点和适用场景,并简要介绍了卷积神经网络(CNN)的替代方案。
|
24天前
|
Web App开发 JavaScript 前端开发
使用 Chrome 浏览器的内存分析工具来检测 JavaScript 中的内存泄漏
【10月更文挑战第25天】利用 Chrome 浏览器的内存分析工具,可以较为准确地检测 JavaScript 中的内存泄漏问题,并帮助我们找出潜在的泄漏点,以便采取相应的解决措施。
147 9
|
29天前
|
XML 编解码 JavaScript
DOM(文档对象模型)和 BOM(浏览器对象模型)
【10月更文挑战第19天】在前端开发中,理解 DOM(文档对象模型)和 BOM(浏览器对象模型)是至关重要的。它们是 Web 开发的基础,为我们提供了与网页文档和浏览器进行交互的能力。
|
1月前
|
机器学习/深度学习 自然语言处理 前端开发
前端大模型入门:Transformer.js 和 Xenova-引领浏览器端的机器学习变革
除了调用API接口使用Transformer技术,你是否想过在浏览器中运行大模型?Xenova团队推出的Transformer.js,基于JavaScript,让开发者能在浏览器中本地加载和执行预训练模型,无需依赖服务器。该库利用WebAssembly和WebGPU技术,大幅提升性能,尤其适合隐私保护、离线应用和低延迟交互场景。无论是NLP任务还是实时文本生成,Transformer.js都提供了强大支持,成为构建浏览器AI应用的核心工具。
476 1
|
1月前
|
Web App开发 JavaScript 前端开发
JavaScript Window - 浏览器对象模型
JavaScript Window - 浏览器对象模型
22 2
|
1月前
|
JavaScript API
深入解析JS中的visibilitychange事件:监听浏览器标签间切换的利器
深入解析JS中的visibilitychange事件:监听浏览器标签间切换的利器
125 0
|
1月前
|
JavaScript 前端开发 开发者
JavaScript 浏览器控制台的使用
JavaScript 浏览器控制台的使用
22 0
下一篇
无影云桌面