JS window对象详解(1)

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 文档,可被用来访问文档内容及其所有页面元素

使用系统对话框

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 ("请输入您的用户名:");
}
复制代码

打开和关闭窗口

使用 window 对象的 open() 方法可以打开一个新窗口。用法如下:

window.open (URL, name, features, replace)
复制代码

参数列表如下:

URL:可选字符串,声明在新窗口中显示网页文档的 URL。如果省略,或者为空,则新窗口就不会显示任何文档。

name:可选字符串,声明新窗口的名称。这个名称可以用作标记 < a > 和 < form > 的 target 目标值。如果该参数指定了一个已经存在的窗口,那么 open() 方法就不再创建一个新窗口,而只是返回对指定窗口的引用,在这种情况下,features 参数将被忽略。

features:可选字符串,声明了新窗口要显示的标准浏览器的特征,具体说明如下表所示。如果省略该参数,新窗口将具有所有标准特征。

replace:可选的布尔值。规定了装载到窗口的 URL 是在窗口的浏览历史中创建一个新条目,还是替换浏览历史中的当前条目。

新创建的 window 对象拥有一个 opener 属性,引用打开它的原始对象。opener 只在弹出窗口的最外层 window 对象(top)中定义,而且指向调用 window.open() 方法的窗口或框架。

示例

下面示例演示了打开的窗口与原窗口之间的关系。

win = window.open();  //打开新的空白窗口
win.document.write ("<h1>这是新打开的窗口</h1>");  //在新窗口中输出提示信息
win.focus ();  //让原窗口获取焦点
win.opener.document.write ("<h1>这是原来窗口</h1>");  //在原窗口中输出提示信息
console.log(win.opener == window);  //检测window.opener属性值
复制代码

使用 window 的 close() 方法可以关闭一个窗口。例如,关闭一个新创建的 win 窗口可以使用下面的方法实现。

win.close;
复制代码

如果在打开窗口内部关闭自身窗口,则应该使用下面的方法。

window.close;
复制代码
© 版权声明
THE END
喜欢就支持一下吧
点赞0 分享