JavaScript入门教程(6) Window窗口对象

在网页中，Window对象（窗口对象）是最高级别的对象，代表了一个浏览器窗口或者框架。本文将详细介绍Window对象的属性和方法，并给出相应的示例说明。

窗口对象属性

1. Window.outerWidth 和 Window.outerHeight

这两个属性表示浏览器窗口的宽度和高度，包括边框和滚动条等。如果要获取网页实际可见区域的宽度和高度，可以使用Window.innerWidth和Window.innerHeight。

console.log("浏览器窗口的宽度和高度：", window.outerWidth, window.outerHeight);
console.log("网页实际可见区域的宽度和高度：", window.innerWidth, window.innerHeight);

2. Window.screen 和 Window.screenX/Window.screenY

Window.screen是一个对象，包含了有关用户屏幕的信息，如屏幕大小和分辨率。

Window.screenX和Window.screenY是窗口在屏幕上的位置信息。

console.log("屏幕的宽度和高度：", window.screen.width, window.screen.height);
console.log("窗口在屏幕上的位置信息：", window.screenX, window.screenY);

3. Window.location

Window.location是一个表示当前URL的对象，包含了有关当前网页的信息，如URL，协议，主机名等。

console.log("当前网页的URL：", window.location.href);
console.log("当前网页的协议：", window.location.protocol);
console.log("当前网页的主机名：", window.location.host);
console.log("当前网页的路径名和参数：", window.location.pathname + window.location.search);

窗口对象方法

1. Window.alert() 和 Window.confirm()

Window.alert()方法用于向用户显示一条警告框，只有一个确定按钮。Window.confirm()方法用于向用户显示一个确认框，有确定和取消两个按钮。

// 警告框
window.alert("这是一条警告信息！");

// 确认框
if (window.confirm("你确定要删除吗？")) {
    console.log("用户点击了确定按钮");
} else {
    console.log("用户点击了取消按钮");
}

2. Window.prompt()

Window.prompt()方法用于向用户显示一个对话框，该对话框包含一条消息，一个文本框和两个按钮：“确定”和“取消”。

var name = window.prompt("请输入你的姓名：", "张三");
console.log("你输入的姓名是：" + name);

总结

本文介绍了Window对象的属性和方法，包括浏览器窗口的宽度和高度、屏幕信息、当前URL和弹出框等，通过相关示例说明了这些属性和方法的使用方法。