认识js——事件

    科技2022-07-14  114

    1:什么是冒泡事件?

    1:冒泡事件是由微软公司提出的,从触发底部事件一直延续到最外层,这个现象就是冒泡! 2:只有嵌套关系的标签和都是一样的事件才可能产生冒泡!

    2:阻止冒泡事件的方法:

    1:evt.stopPropagation() 无法阻止 IE 低版本事件冒泡; 2: evt.cancelBubble = true;兼容 IE 低版本冒泡;

    3:阻止冒泡事件的兼容写法:

    if(evt.cancelBubble){ evt.cancelBubble=true; }else{ evt.stopPropagation(); }

    4:封装阻止冒泡事件方法:

    function stopBubble(event){ if(event.stopPropagation){ event.stopPropagation(); }else{ event.cancelBubble = true; } }

    5:什么是event?

    1:event存在的环境是绑定事件中; 2:event是一个对象,代表事件的状态; 3:event==evet==evt==e;

    6:event的兼容写法:

    var e=evt||window.event;

    7:DOM0事件处理程序:

    1:简单来说就是所有的事件叫DOM0事件。 举例: onclick,onmouseover,onmouseout.... 2:DOM就是文档对象模型,0是指这个事件的最初版本

    8: DOM2事件处理程序:

    1:addEventListener(事件,函数,布尔值) 绑定事件方法 IE不支持 举例: addEventListener('click',function(){ },false) 2:是 true 的话是捕获事件,是 false 的话是冒泡事件; 3:removeEventListener() 删除事件方法 IE不支持

    -------------------------event对象下面的属性---------------------------------------

    1:获取鼠标在可视窗口的位置

    e.clientX 鼠标在x轴的位置 e.clientY 鼠标在y轴的位置

    2:获取鼠标在页面的坐标位置

    pageX 鼠标在页面x轴的位置 pageY 鼠标在页面y轴的位置

    3:获取鼠标在屏幕坐标位置

    screenX 鼠标在屏幕的x轴的位置 screenY 鼠标在屏幕的y轴的位置

    4:获取到鼠标在当前div(元素)上的坐标位置

    offsetY offsetX 火狐浏览器不兼容 layerX 火狐浏览器兼容 layerY

    5: 事件源的兼容(事件委托用到事件源)

    target 是event对象下面的属性,target 返回触发此事件的元素(事件的目标节点)。 event.target 是w3c的写法,ie浏览器不支持 event.srcElement 这是IE的写法 兼容写法 var targt=e.target||e.srcElement;

    6:type 返回对象的具体事件

    7: 阻止默认事件的三种写法:

    cancelable=true IE写法 preventDefault() 标准写法 return false 函数里面常用
    Processed: 0.012, SQL: 8