前端祖传三件套JavaScript的BOM的window对象

Window 对象属性

window.name

name 属性返回或设置当前窗口的名称。

console.log(window.name); // ''
window.name = 'myWindow';
console.log(window.name); // 'myWindow'

window.innerWidth 和 window.innerHeight

innerWidth 和 innerHeight 属性分别返回窗口的内部宽度和高度。

console.log(window.innerWidth); // 窗口的内部宽度
console.log(window.innerHeight); // 窗口的内部高度

window.outerWidth 和 window.outerHeight

outerWidth 和 outerHeight 属性分别返回窗口的外部宽度和高度。

console.log(window.outerWidth); // 窗口的外部宽度
console.log(window.outerHeight); // 窗口的外部高度

window.location

location 属性返回当前窗口的 URL 地址。

console.log(window.location.href); // 当前窗口的 URL 地址

window.history

history 属性返回浏览器历史记录对象，可以访问当前窗口中访问过的所有页面。

console.log(window.history.length); // 当前窗口历史记录长度
window.history.back(); // 返回上一页
window.history.forward(); // 前往下一页

window.navigator

navigator 属性返回浏览器信息对象，包含有关浏览器的详细信息。

console.log(window.navigator.userAgent); // 浏览器用户代理字符串

Window 对象方法

window.alert()

alert() 方法在当前窗口中显示一个警告框，带有指定的消息和一个“确定”按钮。

window.alert('Hello world!');

window.prompt()

prompt() 方法在当前窗口中显示一个提示框，带有指定的消息和一个文本输入框。用户输入的内容将作为函数的返回值。

var input = window.prompt('请输入您的姓名：');
console.log(input);

window.confirm()

confirm() 方法在当前窗口中显示一个确认对话框，带有指定的消息和“确定”和“取消”两个按钮。如果用户单击“确定”按钮，则函数返回 true，否则返回 false。

var result = window.confirm('是否要删除该文件？');
console.log(result);

window.open()

open() 方法打开一个新窗口，并返回一个引用该窗口的对象。

var myWindow = window.open('http://www.baidu.com', 'myWindow', 'width=600,height=400');

window.close()

close() 方法关闭当前窗口或标签页。

window.close();

结论

本文介绍了 JavaScript BOM 的 Window 对象，并提供了一些常用的属性和方法。在前端开发中，Window 对象是一个非常重要的对象，使用它可以实现许多与浏览器窗口相关的操作。

感谢您阅读此篇博文！希望它能帮助您更深入地了解 JavaScript Window 对象及其相关操作。如果您有任何问题或疑问，请随时在评论区留言。