Javascript window对象

最新推荐文章于 2023-03-15 08:58:26 发布

木易一

最新推荐文章于 2023-03-15 08:58:26 发布

阅读量542

点赞数

分类专栏： JavaScript

本文链接：https://blog.csdn.net/weixin_43684713/article/details/87892634

版权

JavaScript 专栏收录该内容

43 篇文章 1 订阅

订阅专栏

window对象

所有浏览器都支持 window 对象。它表示浏览器窗口。

所有 JavaScript 全局对象、函数以及变量均自动成为 window 对象的成员。

全局变量是 window 对象的属性。

全局函数是 window 对象的方法。

甚至 HTML DOM 的 document 也是 window 对象的属性之一：window.document....

<script>
    //全局变量是 window 对象的属性
    var index=10;
    console.log(window.index);//10
    //全局函数是 window 对象的方法
    window.showName();
    function showName(){
        console.log(window.index);//10
    }
</script>

Window 尺寸

<script>
    //window 窗口的尺寸
    console.log(window.screen.width);//浏览器屏幕内容的宽   1600
    console.log(window.screen.height);//浏览器屏幕内容的高   900

    console.log(window.screen.availWidth);//浏览器屏幕的总宽  1600
    console.log(window.screen.availHeight);//浏览器屏幕的总高  860

    console.log(document.documentElement.clientWidth);//浏览器的可视区域的宽   可变
    console.log(document.documentElement.clientHeight);//浏览器的可视区域的高  775

    console.log(document.body.clientWidth);//body的实际宽
    console.log(document.body.clientHeight);//body的实际高


    console.log(window.innerWidth);//浏览器的可视区域的宽   可变
    console.log(window.innerHeight);//浏览器的可视区域的高  775
</script>

Window 方法

window.open("http://www.baidu.com"); //打开一个新窗口
window.moveTo(100,100);   //被限制
window.resizeTo(200,200);  //不能直接使用
location=no,titlebar=no,toolbar=no,status=no ; //用不了

resizeTo() 方法用于把窗口大小调整为指定的宽度和高度。使用时只能动态改变窗口大小

例如：

 var win=window.open("txt.html"," ","width=100,height=100,left=1036,top=750,location=no,titlebar=no,toolbar=no,status=no");
 win.resizeTo(300,300);

上面代码打开一个新的页面，页面宽高已设置，后面用resizeTo()设置打开新窗口的宽高。

alert(); //显示带有一段消息和一个确认按钮的警告框。

confirm(); //显示带有一段消息以及确认按钮和取消按钮的对话框。

prompt(); //显示可提示用户输入的对话框。

stop(); //停止页面载入

window 对象的两个计时器

setTimeout(); 延迟一段时间执行执行一次

语法：setTimeout(code, milliseconds, param1, param2, ...)

setTimeout(function, milliseconds, param1, param2, ...)

参数：

参数	描述
code/function	必需。要调用一个代码串，也可以是一个函数。
milliseconds	可选。执行或调用 code/function 需要等待的时间，以毫秒计。默认为 0。
param1, param2, ...	可选。传给执行函数的其他参数（IE9 及其更早版本不支持该参数）。

eg:

<script>
var count=1;
    setTimeout(function(){
        count++;
        console.log(count);
    },1000);
</script>

输出时延迟一秒，输出为2

setInterval(); 延迟一段时间执行循环执行

语法和参数与setTimeout()相同

清除计时器

clearTimeout() 方法可取消由 setTimeout() 方法设置的 timeout。仅能清除一次

clearInterval() 方法可取消由 setInterval() 设置的 timeout。可多次使用

eg:

<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
<button id="btn">停止计时器</button>
<button id="btnstart">开启计时器</button>
<script>
     var time;
     var count=0;
     showtime();
     function showtime(){
     time=setInterval(function (){
     count++;
     console.log(count);
     },1000)
     }
     var btn=document.getElementById("btn");
     var btnstart=document.getElementById("btnstart");
     btn.onclick=function (){
         clearInterval(time);
//         clearTimeout(time);
     };
     btnstart.onclick=function (){
     showtime();
     }

</script>
</body>
</html>

弹出提示框类型

alert() 提示框

confirm() 用于显示一个带有指定消息和 OK 及取消按钮的对话框。

prompt() 用于显示可提示用户进行输入的对话框。

木易一

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Javascript window对象

window对象所有浏览器都支持window对象。它表示浏览器窗口。所有 JavaScript 全局对象、函数以及变量均自动成为 window 对象的成员。全局变量是 window 对象的属性。全局函数是 window 对象的方法。甚至 HTML DOM 的 document 也是 window 对象的属性之一：window.document....&lt;scrip...
复制链接

扫一扫

专栏目录