js学习4

一、类数组对象arguments

arguments不是数组，不能使用数组方法，只能使用length。在没有形参的情况下，可以使用arguments获取所有实参。只能在函数体中使用。

function fun(){
	console.log(arguments);
}
fun(1,2,3,4,5,6);

二、闭包*（面试重点）

可以访问其他作用域的变量的函数，即函数嵌套函数。

1.引入库

2.读入数据

三、DOM

节点树：节点即为标签，节点数即为标签间的关系。
DOM：可理解为整个节点数的最为层根节点，是内置的document对象，是引用类型数据。

DOM属性

1.documentElement
获取节点树的Html标签

document.documentElement;//获取节点树的Html标签
document.head;
document.title;
document.body;

只有这四个。

DOM方法

1.getElementById
通过标签ID选择器，在JS中获取对应标签节点。

var element=document.getElementById("box");

2.querySelector

event事件对象

任意结点树上的节点都可以绑定多个事件。当用户触发事件的时候，系统会自动给事件处理函数传递实参（自动注入实参），这个参数即为事件对象。

var div=document.querySlector("div");
div.onclick= function(event){//其他也可以，一般写event
	var e= event||window.event;//兼容IE8以下
	console.log(e);
}

获取鼠标位置

当用户出发事件时，系统自动给事件21 去AS Q1 q全往ASQ处理函数注入实参（事件处理函数），他给我们提供很多信息，可获取鼠标位置。

1.screenX||screenY

事件对象属性，获取鼠标位置，零零点在电脑屏幕左上角。

2.pageX||pageY

事件对象属性，获取鼠标位置，零零点在网页主体部分左上角，不包含浏览器的导航、网页选择框等。

3.clientX||clinetY

事件对象属性，获取鼠标位置，零零点为可视区域的左上角。

4.offsetX||offsetY

事件对象属性，获取鼠标位置，获取数据类似pageX||pageY，但是会受子元素影响，即只获取鼠标所在的最小区域的坐标。

原生JS实现拖拽效果

三步骤：鼠标按下、鼠标移动、鼠标抬起

京东放大镜效果

四、BOM

【browser object model】提供一些获取浏览器信息的属性和方法，即浏览器内置的window对象。
BOM方法可省略window
如：

window.location.href//获取地址栏信息
window.screen.width//获取电脑屏幕信息
window.screen.height;
window.navigator.userAgent;//获取浏览器信息

定时器setInterval方法

定时器：每隔一段时间执行一次回调函数。
语法格式：

setInterval(callback,time)；
setInterval(function(){
	console.log("我是定时器")
},1000);

第一个参数必有【回调函数，当一个函数执行的时候，传递实参是另一个函数的声明部分】
第二个参数，时间，单位毫秒，1s=1000ms。

异步语句

若一个语句非常耗时间【称之为异步语句】。
特点：先执行异步语句后面的代码，回首再执行异步语句。

//清除定时器方法
clearInterval(n);//n表示第几个定时器

运动套路

定时器+改变定位元素left、top。

游戏之战：浩克行走