Javascript中的window对象基本属性和方法以及对alert,confirm,prompt的使用

亦凉 2022-08-26 12:16 221阅读 0赞

之前一直对BOM的东西一知半解，最近又拿起js的书来进一步学习下关于BOM的各种对象。

BOM的对象主要有：

window对象：客户端Javascript中的顶级对象

navigator对象：包含客户端浏览器的信息

screen对象：包含客户端显示屏的信息

history对象：包含浏览器窗口访问过的URL

location对象：包含当前URL的信息

document对象：包含整个HTML文档，可被用来访问页面的所有元素(跟DOM息息相关)

首先就是window对象了，它可以说是BOM的基类，BOM的根节点。

重要的属性：

closed：判断当前窗口是否关闭

defaultStatus：在浏览器状态栏显示的默认文本

status：在浏览器状态栏中显示的文本

document：对Document对象的引用

frames\[\]：window对象数组，代表窗口中的各个框架，这个很重要，后面的框架集要用到

history：对History对象的引用，代表用户浏览窗口的历史

location：对Location对象的引用，代表在窗口中显示的文档的URL

name：窗口的名称，可被<a>的<target>属性使用

opener：对打开当前窗口的window对象的引用

self：自引用，与window同义

window：自引用，与self同义

以下两个属性注意比较：

parent：如果当前的窗口是框架，他就是对窗口中包含这个框架的父级框架的引用

top：如果当前窗口时框架，他就是对包含这个框架的顶级窗口的window对象的引用。注意，对于嵌套在其他框架中的框架，top不等于parent

这里对parent和top做一个具体的分析：

一、如果一个窗口时顶级窗口(window)，而不是框架(framest,frame)，parent属性引用的就是这个窗口本身，可以说parent==self。

二、如果一个框架包含在另一个框架中，而后者又包含在顶级窗口中，这是该框架可以用parent.parent来访问顶级窗口

三、无论任何一个框架，不管被嵌套了多少层，它的top属性引用的都是包含它的顶级窗口

四、如果一个window对象代表的是一个顶级窗口，那么它的top属性引用的就是窗口本身，对于那些是顶级窗口的直接子窗口，top属性就等于parent属性

重要的方法：

alert()，confirm()，prompt()：人机交互的接口的方法。

close()：关闭窗口

focus()，blur()：请求或放弃窗口的键盘焦点

moveBy()，moveTo()：移动窗口

open()：打开新的顶级窗口

print()：打印窗口内容

resizeBy()，resizeTo()：调整窗口大小

scrollBy(),scrollTo()：滚动窗口中显示的文档

setInterval()，clearInterval()：设置或取消重复调用的函数，两次调用之间有指定的延迟

setTimeout()，clearTimeout()：设置或者取消在指定的若干毫秒后要调用一次的函数

以下是用alert()，confirm()，prompt()人机交互的例子：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>window人机交互</title>
    </head>
    
    <body>
    <script type="text/javascript">
    var user=prompt("请输入你的用户名：");
    if(!!user)  //把输入的信息转换成布尔值
    {
    	var ok=confirm("你输入的用户名为：\n"+user+"\n请确认");
    	if(ok)
    	{
    		alert("欢迎你:\n"+user);
    	}
    	else  //重新输入信息
    	{
    		user=prompt("请输入你的用户名：");
    		alert("欢迎你:\n"+user);
    	}
    }
    else  //提示输入信息
    {
    	user=pormpt("请输入你的用户名：");
    }
    </script>
    </body>
    </html>