Window 对象

悠悠 2024-04-19 11:59 53阅读 0赞

Window对象表示浏览器打开的窗口。  
window对象集合：frames\[\]–返回窗口中所有命名的框架。  
Window对象属性：innerHeight–返回窗口的文档显示区的高度。  
innerWidth–返回窗口的文档显示区的宽度。  
outerHeight–返回窗口的外部高度。  
outerWidth-- 返回窗口的外部宽度。  
以及其他属性  
Window对象方法：open()–打开一个新的浏览器窗口或查找一个已命名的窗口。  
close()–关闭浏览器窗口。  
setTimeout()–在指定的毫秒数后调用函数或计算表达式。  
clearTimeout()–取消由 setTimeout() 方法设置的 timeout。  
setInterval()–按照指定的周期（以毫秒计）来调用函数或计算表达式。  
clearInterval()–取消由 setInterval() 设置的 timeout。  
以及其他方法  
现在我们把这些方法调用到按钮上来展示效果  
console.log(“window.innerHeight =” + window.innerHeight);  
console.log(“window.innerWidth =” + window.innerWidth);

console.log("window.outerHeight =" + window.outerHeight);
        console.log("window.outerWidth =" + window.outerWidth);

页面输出：  
![在这里插入图片描述][20190918082107214.PNG]  
打印  
function printWin() \{  
window.print();  
\}  
调用打印功能  
![在这里插入图片描述][20190918082116567.PNG]  
打开窗口  
function openWin() \{  
myWindow = window.open(“https://www.baidu.com”, “baidu”, “width=200,height=100”);  
\}  
![在这里插入图片描述][20190918082143873.PNG]  
关闭窗口  
function closeWin() \{  
myWindow.close();  
\}  
点击后即可关闭之前打开的窗口  
关闭本窗口  
function closeThisWin() \{  
window.close(); //对部分浏览器无效，如Firefox;;提示：脚本不得关闭非脚本打开的窗口。  
\}  
点击后关闭浏览器窗口  
开始SetTimeout定时器  
关闭SetTimeout定时器  
function startSetTimeout() \{  
objSetTimeout = window.setTimeout(timerJob2, 1000);  
\}  
//取消由 setTimeout() 方法设置的定时器  
function cleanSetTimeout() \{  
clearTimeout(objSetTimeout);  
\}  
![在这里插入图片描述][20190918082201419.PNG]

<button type="button" onclick="startSetInterval()">开始SetInterval定时器</button>

关闭SetInterval定时器  
function startSetInterval() \{  
objSetInterval = window.setInterval(timerJob, 1000);  
\}  
//取消由 setInterval() 设置的定时器  
function cleanSetInterval() \{  
clearInterval(objSetInterval);  
\}  
![在这里插入图片描述][20190918082214123.PNG]

[20190918082107214.PNG]: https://img-blog.csdnimg.cn/20190918082107214.PNG
[20190918082116567.PNG]: https://img-blog.csdnimg.cn/20190918082116567.PNG
[20190918082143873.PNG]: https://img-blog.csdnimg.cn/20190918082143873.PNG
[20190918082201419.PNG]: https://img-blog.csdnimg.cn/20190918082201419.PNG
[20190918082214123.PNG]: https://img-blog.csdnimg.cn/20190918082214123.PNG