java获取浏览器window对象_JS window对象详解

本文详细介绍了JavaScript中的window对象,包括其作为全局对象的角色、如何访问客户端对象、使用系统对话框、打开和关闭窗口的方法,以及定时器的使用。此外,还展示了如何在不同框架间交互和控制窗口大小、位置。window对象是JavaScript在浏览器环境中进行交互的核心。
摘要由CSDN通过智能技术生成

window 是客户端浏览器对象模型的基类,window 对象是客户端 JavaScript 的全局对象。一个 window 对象实际上就是一个独立的窗口,对于框架页面来说,浏览器窗口每个框架都包含一个 window 对象。

全局作用域

在客户端浏览器中,window 对象是访问 BOM 的接口,如引用 document 对象的 document 属性,引用自身的 window 和 self 属性等。同时 window 也为客户端 JavaScript 提供全局作用域。

示例

由于 window 是全局对象,因此所有的全局变量都被解析为该对象的属性。

var a = "window.a"; //全局变量

function f () { //全局函数

console.log(a);

}

console.log(window.a); //返回字符串“window.a”

window.f(); //返回字符串“window.a”

使用 delete 运算符可以删除属性,但是不能删除变量。

访问客户端对象

使用 window 对象可以访问客户端其他对象,这种关系构成浏览器对象模型,window 对象代表根节点,浏览器对象关系的关系如图所示,每个对象说明如下。

window:客户端 JavaScript 顶层对象。每当

或 标签出现时,window 对象就会被自动创建。

navigator:包含客户端有关浏览器信息。

screen:包含客户端屏幕的信息。

history:包含浏览器窗口访问过的 URL 信息。

location:包含当前网页文档的 URL 信息。

document:包含整个 HTML 文档,可被用来访问文档内容及其所有页面元素。

9bbb50e704b99157cbbb7b3275918f1b.png

使用系统对话框

window 对象定义了 3 个人机交互的方法,主要方便对 JavaScript 代码进行调试。

alert():确定提示框。由浏览器向用户弹出提示性信息。该方法包含一个可选的提示信息参数。如果没有指定参数,则弹出一个空的对话框。

confirm():选择提示框。。由浏览器向用户弹出提示性信息,弹出的对话框中包含两个按钮,分别表示“确定”和“取消”按钮。如果点击“确定”按钮,则该方法将返回 true;单击“取消”按钮,则返回 false。confirm() 方法也包含一个可选的提示信息参数,如果没有指定参数,则弹出一个空的对话框。

prompt():输入提示框。可以接收用户输入的信息,并返回输入的信息。prompt() 方法也包含一个可选的提示信息参数,如果没有指定参数,则弹出一个没有提示信息的输入文本对话框。

示例1

下面示例演示了如何综合调用这 3 个方法来设计一个人机交互的对话。

var user = prompt("请输入您的用户名");

if (!! user) { //把输入的信息转换为布尔值

var ok = confirm ("您输入的用户名为:\n" + user + "\n 请确认。"); //输入信息确认

if (ok) {

alert ("欢迎您:\n" + user);

} else { //重新输入信息

user = prompt ("请重新输入您的用户名:");

alert ("欢迎您:\n" + user);

}

} else { //提示输入信息

user = prompt ("请输入您的用户名:");

}

这 3 个方法仅接收纯文本信息,忽略 HTML 字符串,只能使用空格、换行符和各种符号来格式化提示对话框中的现实文本。提示,不同的浏览器对于这 3 个对话框的显示效果略有不同。

也可以重置这些方法。设计思路:通过 HTML 方式在客户端输出一段 HTML 片段,然后使用 CSS 修饰对话框的显示样式,借助 JavaScript 来设计对话框的行为和交互效果。

示例2

下面是一个简单的 alert() 方法,通过 HTML + CSS 方式,把提示信息以 HTML 层的形式显示在页面中央。

window.alert = function (title, info) {

var box = document.getElementById ("alert_box");

var html = '

' + title + '
' + info + '

if (box) {

box.innerHTML = html;<

  • 0
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值