[妙味DOM]第三课:Event-事件详解1

知识点总结

  • 焦点事件
onfocus  获取焦点
onblur    失点焦点

obj.focus()   给指定元素设置焦点
obj.blur()     取消指定元素的焦点
obj.select()  选择指定元素里的文本内容,只能选择用户输入的内容,例如:全选后就可以复制,input textarea
  •  event对象
var ev = ev(标准下)||event(非标准下,即IE)
  • clientX,clientY
鼠标到可视区的距离

ev.clientX/clientY

例子:方块跟随鼠标移动,注意client是到可视区的距离,还需要加上鼠标滚动的距离,即scrollTop/scrollLeft,还需要兼容,即scrollTop = document.documentElement.scrollTop ||document.body.scrollTop;
  •  事件冒泡
ev.cancelBubble = true  阻止冒泡
  •  事件绑定
在IE下:
    obj.attachEvent('onclick',fn);
    
    1、没有捕获;
    2、事件名称有‘on’;
    3、事件函数执行的顺序,在标准下:正序,IE9以下(不包括IE9):倒序;
    4、函数中的this指向的是window,除非用了call方法,即:
         obj.attachEvent('onclick',function(){
                 fn.call(obj);   //call方法的第一个参数:可以改变this指向,第二个参数开始:就是实际的传参。
         })


在标准下:
    obj.addEventListener('click',fn,false);

    1、有捕获;
    2、事件名称没有'on'
    3、事件函数执行的顺序:正序
    4、函数中的this指向:触发该事件的对象


因此,需要做兼容,见“JS框架处”
http://www.cnblogs.com/joya0411/p/3557400.html
原文地址:https://www.cnblogs.com/joya0411/p/3564258.html