事件对象

this

this的指向：

1. 在普通函数外部调用时：
   this指向window
   alert( this ) 指向window
alert( this.a )指向window.a

2. 在普通函数内部调用时：
   this指向window

function( ) {
		console.log( this.a );  指向window，相当于window.a
	}

3. 呢new构造器结合使用时
   this指向访问的对象

function text( ）{
		this.a = function( ){
			console.log( this )	指向访问对象
		}
	}

4. 对于自调用匿名函数而言
   this指向window（当不希望this的指向发生改变时，可以定义变量储存this）

---

event对象

来源：
当事件发生时，由处理时间的函数会接收到一个event对象
用途：
event对象用于储存事件源的各种信息
并这些信息提供给开发者便于开发者进行编码
event对象的属性（所储存的数据）

• ev.target 事件源
• ev.button 返回鼠标被按下的那个键
• ev.offsetX 鼠标在元素上 X轴的位置
• ev.offsetY 鼠标在元素上 Y轴的位置
• ev.clientX 鼠标 在浏览器可视区域 x轴上的位置(左边距)
• ev.clientY 鼠标 在浏览器可视区域 y轴上的位置(上边距)
• ev.scrollX 表示当前元素从原点水平滚动的像素数
• ev.scrollY 表示当前元素从原点垂直滚动的像素数
• ev.keyCode 返回键盘的编码，以此来确定是哪个键位

---

使用实例：

//选项卡的两种方法：
window.onload = function(){
		var but = document.getElementsByClassName(" btn ");  获取页面元素
		var box = document.getElementsByClassName(" box ");
方法1： but[0].onclick = function(){
			for(var i = 0; i < box.length; i++){	//将所有div隐藏
				box[i].style.display = "none";
			}		
			this.style.display = "block";			//将指定的元素显示
			// this: 在事件中使用时，指向这个事件的调用者
		}
		//将事件绑定给每一个选项
方法2：	for(var j = 0 ; j < but.length; j++){ 		//通过for循环便捷将事件绑定给每个选项
			but[j].index = j;
			but[j].onclick = function(){
				for(var i = 0; i < box.length; i++){
					box[i].style.display = "none";
				}
				box[this.index].style.display = "block";
			}
		}
	}