zoukankan      html  css  js  c++  java
  • DOM事件

    事件流
    事件:是文档或浏览器窗口中发生的特定的交互瞬间。JavaScript和HTML之间的交互都是由事件来实现。动作都是由事件触发的。
    事件流:描述的是从页面中接受事件的顺序。
    IE的事件流——事件冒泡流。Netscape网景——事件捕获流。
    事件冒泡
    事件冒泡:即事件最开始由最具体的元素(文档中嵌套层次最深的那个节点)接受,然后逐级向上传播到最不具体的那个节点(文档)。
    事件捕获
    事件捕获:不太具体的节点应该更早接受到事件,而最具体的节点最后接受到事件。
    事件处理程序
    HTML事件处理程序
    直接写在HTML中的事件,比如直接在button中加上onclick="alert('hello')",或者onclick="x()",在<body>标签中写函数x()。
    缺点:HTML和JS代码紧密地耦合在一起。修改起来非常麻烦。
    DOM0级事件处理程序
    较传统的方式:把一个函数赋值给一个事件的处理程序属性。把对象取出来,让事件以对象属性的形式出现,去给它添加这样的事件,可以添加多个事件。
    var btn2=codument.getElementById('btn2');,再调用btn2.
    DOM2级事件处理程序
    DOM2级事件定义了两个方法:
    addEventListener()用于指定之间处理程序的操作 Listener听众
    removeEventListner()用于删除事件处理程序的操作。
    接收三个参数:要处理的事件名、作为事件处理的程序、布尔值。
    DOM0和DOM2级事件处理程序无法在IE上运行,所以有IE事件处理程序及跨浏览器解决
    attachEvent()添加事件
    detachEvent()删除事件
    接收相同的两个参数:事件处理程序的名称和事件处理程序的函数,不需要布尔值,因为IE只支持事件冒泡不支持事件捕获,所以不需要选择。
    跨浏览器解决,封装在一个对象内,浏览器可以自行选择。
    事件对象
    DOM中的事件对象
    1.type属性:用于获取事件类型
    2.target属性:用于获取事件目标
    3.stopPropagation()方法:用于阻止事件冒泡
    4.preventDefault()方法: 阻止事件的默认行为
    IE中的事件对象
    1.type属性:用于获取事件类型
    2.srcElement属性:用于获取事件目标
    3.cancelBubble属性:用于阻止事件冒泡,设置ture为阻止,false为不阻止
    4.returnValue属性:阻止事件的默认行为,设置false为阻止事件的默认行为
    跨浏览器解决,封装在一个对象内,浏览器可以自行选择。
    事件类型
    鼠标事件
    QQ面板拖动-在标题区域按下-在页面中移动-释放鼠标时停止移动
    onmousedown:在用户按下任何鼠标按钮时触发。
    鼠标事件都是在浏览器窗口中的特定位置上发生的,这个位置信息都保存在事件的clientX和clientY属性中。所有浏览器都支持这两个属性。
    他们的值表示事件发生时鼠标指针在视口中的水平和垂直坐标。不包括页面滚动的距离。
    onmouseover是指当鼠标指针在元素内部移动时重复地触发。
  • 相关阅读:
    python基础之====函数对象、函数嵌套、名称空间与作用域、装饰器
    python基础之函数基础
    pytho基础之文件处理
    python基础之字符编码
    python基础之数据类型与变量
    python基础之核心风格
    函数
    数据类型、字符编码、文件处理
    MongoDB
    Shell学习(三)——Shell条件控制和循环语句
  • 原文地址:https://www.cnblogs.com/pearl8/p/7967783.html
Copyright © 2011-2022 走看看