window对象常见事件

调整窗口大小

window.onresize

window.onresize为调整窗口大小触发事件，通俗来讲就是当调整浏览器可视区的大小的时候触发onresize事件。
使用方法如下

<body>
    <script>
        window.addEventListener('resize', function () {
            console.log('变化了');
        })
    </script>
</body>

运行结果如下
在这里插入图片描述

定时器

添加定时器1：window.setTimeout(调用函数,[延迟毫秒数])

使用方法：在规定的延迟时间到了之后，执行调用函数里面的函数。（只调用一次）
window在调用的时候可以省略，只写setTimeout(调用函数,[延迟毫秒数])就可以。延迟毫秒数默认为0
页面中通常存在许多计时器，因此我们可以给计时器添加名字
具体调用方法如下所示

<body>
    <script>
    //调用方法1
        setTimeout(function(){
        	console.log('到点了');
        },2000);
    //调用方法2
    	function getnum(){
    		console.log('1');
    	}
    	setTimeout(getnum,2000);
    //调用方法3
    	function getnum(){
    		console.log('1');
    	}
    	setTimeout('getnum()',2000);
    //给计时器添加名字
    	var time1 = setTimeout(getnum,2000);
    	var time2 = setTimeout(getnum,3000);
    </script>
</body>

添加定时器2：window.setInterval(调用函数,[延迟毫秒数])

使用方法：在规定的延迟时间到了之后，执行调用函数里面的函数。（反复调用）
window在调用的时候可以省略，只写setTimeout(调用函数,[延迟毫秒数])就可以。延迟毫秒数默认为0
页面中通常存在许多计时器，因此我们可以给计时器添加名字。
具体调用方法如下所示

<body>
    <script>
    //调用方法1
        setInterval(function(){
        	console.log('到点了');
        },2000);
    //调用方法2
    	function getnum1(){
    		console.log('1');
    	}
    	setInterval(getnum1,2000);
    //调用方法3
    	function getnum2(){
    		console.log('2');
    	}
    	setInterval('getnum2()',2000);
    //给计时器添加名字
    	var time1 = setInterval(getnum1,2000);
    	var time2 = setInterval(getnum2,3000);
    </script>
</body>

清除定时器1：window.clearTimeout(timeoutID)

该事件可以清除setTimeout定时器。window在调用的时候可以省略，里面的参数就是定时器的名字（也就是定时器的标识符）
具体使用方法如下

<body>
    <button>清除定时器</button> 
    <script>
    //调用方法2
    	var btn = document.querySelector('button')
    	function getnum(){
    		console.log('1');
    	}
    	var time1 = setTimeout(getnum,2000);
    	btn.addEventListener('click',function(){
			clearTimeout(time1)
		})
    </script>
</body>

清除定时器2：window.clearInterval(intervalID)

该事件可以清除setInterval定时器。window在调用的时候可以省略，里面的参数就是定时器的名字（也就是定时器的标识符）
具体使用方法如下

<body>
    <button>清除定时器</button> 
    <script>
    //调用方法2
    	var btn = document.querySelector('button')
    	function getnum(){
    		console.log('1');
    	}
    	var time1 = setInterval(getnum,2000);
    	btn.addEventListener('click',function(){
			clearInterval(time1)
		})
    </script>
</body>