javascript操作BOM的方法

最新推荐文章于 2024-10-08 13:51:35 发布

TechWhiz-晓同

最新推荐文章于 2024-10-08 13:51:35 发布

阅读量493

点赞数 12

分类专栏： javascript 文章标签： javascript 开发语言

本文链接：https://blog.csdn.net/m0_72603435/article/details/136488555

版权

javascript 专栏收录该内容

47 篇文章 0 订阅

订阅专栏

本文介绍了JavaScript中与浏览器对象模型(BOM)相关的九种常用方法，包括window.alert(),window.confirm(),window.prompt(),window.location()等，展示了如何通过这些方法实现浏览器窗口和脚本间的交互，以及获取和设置URL、浏览器信息、屏幕尺寸和历史记录等功能。

摘要由CSDN通过智能技术生成

8.window.setTimeout() 和 window.clearTimeout()

9.window.setInterval() 和 window.clearInterval()

BOM（Browser Object Model）是浏览器对象模型，它提供了独立于任何特定文档的对象，用于浏览器窗口和浏览器窗口中的脚本之间的交互。以下是一些常用的 JavaScript 操作 BOM 的方法：

1.window.alert()

弹出一个警告框，显示指定的文本和 OK 按钮。

window.alert("这是一个警告框！");

2.window.confirm()

弹出一个带有确定和取消按钮的对话框，并返回用户的选择（true 或 false）。

var result = window.confirm("你确定要继续吗？");  
if (result) {  
    console.log("用户点击确定");  
} else {  
    console.log("用户点击取消");  
}

3.window.prompt()

弹出一个带有文本输入字段和确定及取消按钮的对话框，并返回用户输入的文本（如果用户点击确定）或 null（如果用户点击取消）。

var name = window.prompt("请输入你的名字", "Harry Potter");  
console.log("你好，" + name + "!");

4.window.location()

用于获取或设置窗口的 URL，并可以解析 URL 的各个组成部分。

// 设置窗口的 URL  
window.location.href = "https://www.example.com";  
  
// 获取当前 URL  
var currentURL = window.location.href;  
console.log(currentURL);  
  
// 获取 URL 的各个部分  
var hostname = window.location.hostname; // example.com  
var pathname = window.location.pathname; // /path/to/page.html  
var search = window.location.search; // ?query=string  
var hash = window.location.hash; // #section

5.window.navigator()

包含有关浏览器的信息。

var browserName = window.navigator.appName;  
var browserVersion = window.navigator.appVersion;  
console.log("浏览器名称：" + browserName);  
console.log("浏览器版本：" + browserVersion);

6.window.screen()

包含有关客户端屏幕的信息。

var screenWidth = window.screen.width;  
var screenHeight = window.screen.height;  
console.log("屏幕宽度：" + screenWidth);  
console.log("屏幕高度：" + screenHeight);

7.window.history()

允许脚本与浏览器的历史记录进行交互。

// 后退一页  
window.history.back();  
  
// 前进一页  
window.history.forward();  
  
// 加载历史列表中的特定页面  
window.history.go(n); // n 为要加载的页面在历史列表中的相对位置

8.window.setTimeout() 和 window.clearTimeout()

用于在指定的毫秒数后执行函数，或取消之前设置的定时器。

// 设置定时器  
var timerId = window.setTimeout(function() {  
    console.log("5 秒后执行此函数");  
}, 5000);  
  
// 取消定时器  
window.clearTimeout(timerId);

9.window.setInterval() 和 window.clearInterval()

用于每隔指定的毫秒数重复执行函数，或取消之前设置的间隔定时器。

// 设置间隔定时器  
var intervalId = window.setInterval(function() {  
    console.log("每秒执行此函数");  
}, 1000);  
  
// 取消间隔定时器  
window.clearInterval(intervalId);

以上只是 BOM 的一部分功能，实际上 BOM 还提供了更多的方法和对象，用于与浏览器进行交互。