浅析javascript中的Event事件

1、焦点：当一个元素有焦点的时候，那么他就可以接受用户的输入(不是所有元素都能接受焦点)

给元素设置焦点的方式：

　   1、点击

　　2、tab

　　3、js

2、（例子：输入框提示文字）

　　onfocus:当元素获取焦点时触发：

       element.onfocus = function(){};

　   onblur:当元素失去焦点时触发：

       element.onblur = function(){};

  　  obj.focus() 给指定的元素设置焦点

　　obj.blur() 取消指定元素的焦点

　　obj.select()选择指定元素里面的文本内容

3、（例子：方块随着鼠标移动）

       event: 事件对象。

　　当一个事件发生时，和当前这个对象发生的事件所有有关的信息都会临时保存在一个指定的地方-event对象，供我们需要时调用。就像是飞机的黑匣子。

　　事件对象必须在一个对象的事件调用函数中使用才有内容。

　　事件函数：事件调用的函数，一个函数是不是事件函数，不在定义时决定而是在调用的时候决定

4、兼容

       element.onclick = fn1;

　　IE/Chrome浏览器:event是一个内置的全局对象（可以直接使用）

 function fn1(){ 　　alert(event);  }

　　标准下：事件对象是通过事件函数的第一个参数传入

 function fn1(ev){　　　　alert(ev); }

　　兼容写法：

  function fn1(ev){ 　　　　var ev = ev || event;  }

　　clientX[Y]:当一个事件发生的时候，鼠标到页面可视区的距离

5、事件流（例子：仿select控件）

　　● 事件冒泡：当一个元素接受到事件的时候，会把他接受到的事件传播给他的父级，一直到顶层window。

　　● 事件捕获:一个元素要想接受到事件，它的父元素会首先接受到该事件，然后再传给它。

　　注意：在ie下是没有的事件捕获的。在事件绑定中，标准下有

6、事件绑定

　　● 第一种：

       element.onclick = fn1;

　　注意：oDiv.onclick = fn1;

　　　　　oDiv.onclick = fn2;

　　　　　这样fn2会覆盖fn1;

　　● 第二种：

　　IE:obj.attachEvent(事件名称，事件函数)

  　　　 1、没有捕获

　　　　2、事件名称有on

　　　　3、事件函数的执行顺序：标准》正序 非标准》倒序

　　　　4、this指向window

       element.attachEvent(onclick,fn1);

　　标准：obj.addEventListener(事件名称，事件函数，是否捕获)