事件和事件传播流程

事件和事件传播流程

+ 在js中有很多触发行为需要被监听到 而事件是可以被 JavaScript 侦测到的行为 也是JS与HTML之间的交互的实现

事件

• 事件的概念
  • 事件就是文档或浏览器在交互的瞬间。可以使用处理程序来预定事件，以便事件发生时执行相应的代码
• 事件的调用
  box.onclick = function(){ console.log(123); }; box.onmousedown = function(){ console.log(123); }
• 事件源
  • 触发事件的源头
• 事件处理函数
  • 触发事件源的对于的事件类型时直接执行得函数
• 事件类型的分类
  • 鼠标类
    • 点击：obclick
      双击：ondblclick
      鼠标按下：onmousedown
      鼠标抬起：onmouseup
      鼠标进入：onmouseover/onmouseenter
      鼠标离开：onmousemove
  • 键盘类
    • 按下：onkeydown
      抬起：onkeyup
      按下并抬起：onkeypress
  • 表单控件类
    • 失去焦点：onblur
      获取焦点：onfocus
      输入：oninput
      改变：onchange
      提交：onsubmit
      重置：onreset
  • 页面类
    • 页面加载结束执行：onload
      滚动：onscroll
      改变页面：onresize

事件传播流程

• 事件传播流程的概念
  • 事件流程指的是从页面中接受事件的执行顺序
• 事件传播流程分为三个阶段
  • 捕获阶段
    • 事件从最顶层元素开始一层层向下执行，直到最精确的元素
  • 处于目标阶段
    • 表示事件在最精确元素身上执行
  • 冒泡阶段
    • 事件从最精确元素开始一层层向上执行知道最顶层元素

以上就是我对事件和事件传播流程的理解，希望可以帮助到大家