本帖最后由 上海分校-小影 于 2018-9-7 14:39 编辑
Window- 在浏览器中,它首先是一个全局(global)对象,然后才是一个访问浏览器的接口。
- 所有在全局作用域中声明的变量、函数都是window对象的属性和方法,全局this也必定是指向window。
- 其实有很多的全局JS对象都是window的属性,比如location,可以直接访问,也可以window.location访问。
- let age = 22; window.age; // 22 this.age; // 22如果页面中包含框架(iframe),则每一个框架都有自己的window对象,并且保存在frames集合(类数组)中。访问顺序是从左到右,从上到下,如图所示:
-
- 确定窗口位置
- 通过screenX,screenY或者screenTop,screenLeft来确定窗口位置,但是各个浏览器差异非常大:
- Firefox支持X,Y而不支持Top
- 各个浏览器对位置距离的支持不一样,比如IE的top属性指的是页面可见区域的距离,而chrome的top属性保存的则是整个浏览器的距离。
窗口大小- 通过innerWidth,innerHeight,outerWidth,outerHeight来确定窗口的大小。同样的,在各个浏览器中差异也很大。不建议使用了。
打开窗口- 主要使用window.open()方法。
- let windowObjectReference = window.open(strUrl, strWindowName, [strWindowFeatures]);
- /* WindowObjectReference 打开的新窗口对象的引用。如果调用失败,返回值会是 null 。如果父子窗口满足“同源策略”,你可以通过这个引用访问新窗口的属性或方法。
- strUrl 新窗口需要载入的url地址。strUrl可以是web上的html页面也可以是图片文件或者其他任何浏览器支持的文件格式。
- strWindowName
- 新窗口的名称。该字符串可以用来作为超链接 <a> 或表单 <form> 元素的目标属性值。字符串中不能含有空白字符。注意:strWindowName 并不是新窗口的标题。
- strWindowFeatures 可选参数。是一个字符串值,这个值列出了将要打开的窗口的一些特性(窗口功能和工具栏) 。 字符串中不能包含任何空白字符,特性之间用逗号分隔开。。*/
- 间歇调用和超时调用
- 超时调用:
- setTimeout(func,interval),一段时间后只会执行一次,可以使用clearTimeout清除该间歇调用。
- // 2s 后触发定时器 let newTimeset = setTimeout(() => console.log('time out!' + this), 2000);
- // 在指定时间尚未过去前可以清除该定时器
- clear Timeout(newTimeset);
- 间歇调用:
- setInterval(func,interval),每一个间隔时间都会执行一次,同样可以使用clearInterval清除超时调用;
- // 每过2s都会触发该定时器
- let newTimeset = setInterval(() => console.log('time out!'), 2000);
- // 在指定时间尚未过去前可以清除该定时器
- clear Timeout(newTimeset);
- 需要注意的是,函数中的this是window,而在严格模式下是undefined。
- 除非必要否则我们很少使用间歇调用,而是会使用超时调用来模拟间歇调用,因为间歇调用存在一些问题。
- // 模拟间歇调用
- let num = 0;
- let max = 10;
- let incrementNumber = () => { num++;
- if (num < max) { setTimeout(incrementNumber, 500);
- } else { console.log('Done'); } }
- setTimeout(incrementNumber, 500);对话框
- 对话框
- alert(string);
- prompt(string,string[); // 如果单击了cancel则返回false,否则返回一个string
- confirm(string); // 如果单击了cancel则返回false,否则返回true
|
|