JavaScript·window对象

js三大组成部分

ECMAScript ： js的规范
文档对象模型(DOM) ： 是一套操作页面的APT
浏览器对象模型(BOM) ： 是一套操作浏览器页面的API

window对象

BOM的核心对象是window，它表示浏览器的一个实例，是通过JavaScript访问浏览器窗口的一个接口
特点：

1. 对于全局变量或全局方法，在取值或调用的时候 可以省略window

var a = 12;
console.log(a);
console.log(window.a);
console.log(window);
console.log(window.a === a);//true

2. window 对象是js中的顶级对象（所有的全局变量 全局函数包括document 都是window的属性）

var num = 23;
alert(num);
window.alert(num);

3. window 对象有一个 默认的属性 name，而且name的值只能是字符串

console.log(name);


window.name= 10;
console.log(name);
name = [23,56,34];
console.log(name);

4. top 属性是只读性质的 无法修改

console.log(top);
var top = "abc";
console.log(top);

window里的两个方法

打开窗口：open
使用**window.open()**方法既可以导航到一个特定的URL，也可以打开一个新的浏览器窗口。这个方法可以接收4个参数：要加载的URL、窗口目标、一个特性字符串以及一个表示新页面是否取代浏览器历史记录中当前加载页面的布尔值。通常只须传递第一个参数，最后一个参数只在打不开新窗口的情况下使用
参数：

• url：网址
• name：相当于a标签的target属性；_sele 自己在本页直接打开；_blan 在新的标签页面打开(默认值)
• featrues：设置窗口的大小位置等特征
• replace：true 替换浏览器历史中的当前条目；false 在浏览器历史中创建新条目

如果为window.open()传递了第二个参数，而且该参数是已有窗口或框架的名称，那么就会具有该名称的窗口或框架中加载第一个参数指定的URL。
关闭窗口：close

<button id="opne">打开窗口</button>
<button id="close">关闭窗口</button>
 document.getElementById("open").onclick = function()
            window.open("http://www.baidu.com","_blank","left=200px,top=200px,width=500px.heoght=500px");

        }
        document.getElementById("close").onclick = function(){
            // 关闭窗口：是想关闭哪个窗口 就是使用哪个窗口去调用这个close方法
            window.close();
        }
    </script>

window里的3个事件

script 的内联写法：如果写在head里面 就无法 获取dom元素，因为js代码从上往下执行，解释的时候 body还没有被解析
window的三个事件：从浏览器打开到关闭的三个时刻

1. 页面上的所有内容都加载完毕后才会执行（包括页面DOM元素 外部资源 图片资源）

<div id="box">我是div盒子</div>
<script>
	var box = document.getElementById("box");
	 window.onload = function(){
            alert("页面资源加载完毕");
            // 作用：可以在页面的任意位置获取到dom元素
            var box = document.getElementById("box")
            console.log(box)
        }

</script>

2. 在页面即将要关闭的前一刻

 		window.onbeforeprint = function(){
            alert("页面即将关闭");

            // 作用：挽留客户

            // return "您确定要离开吗？"

            // 病毒 ：关闭网页时  人为的写一个死循环  无限打开新的窗口
            // while(true){
            //     window.open()
            // }

        }

3. 页面正在关闭 无法做任何事

		window.onunload = function(){
            console.log("页面正在关闭");
        }

setTimeout()方法和setInterval()方法

JavaScrip是单线程语言，但它允许通过设置超时值和间歇时间值来调度代码在特定的时刻执行。前者是在指定的时间过后执行的代码。而后者则是每隔指定时间就执行一次代码。

setTimeout()方法

超时调用需要只用setTimeout()方法，它接收两个参数：要执行的代码和以毫秒表示的时间。第一个参数可以是一个包含JavaScrip代码的字符串，也可以是一个函数，不建议传递字符串

//不建议传递字符串
setTimeout("console.log('setTimeout()方法')",1000);

//推荐的调用方式
setTimeout(function(){
	console.log('setTimeout()方法');
},1000);

清除定时器： cleaTimeout() 很少用

var tiemId = setTimeout(function(){
	console.log('setTimeout()方法');
},1000);

clearTimeout(timeId)

setInterval()方法

setInterval(参数1，参数2)

• 参数1 ：回调函数 就是执行的代码
• 参数2 ：事件间隔

setInterval 有一个返回值 就是timeID（定时器ID）

清除定时器 clearInterval（定时器ID）
定时器的ID ：在页面内可以开启多个定时器 那么浏览器为了区分这些定时器，
每当开启一个定时器的时候浏览器就会给这个定时器一个唯一的编号，
那么这个编号就是定时器ID

var num = 0;
var max = 8;
var timeID = null;
function Number(){
	num++;
	if(num == max){
		clearInterval(timeID)
		console.log("结束了")
	}
}
timeID = setInterval(Number,1000);