0
点赞
收藏
分享

微信扫一扫

JavaScript 事件

狐沐说 2022-02-12 阅读 45

事件

一、事件概述

JavaScript使我们有能力创建动态网页,而事件苦于被称为被JavaScript侦测到的行为。
简单可理解为
触发 — 响应机制
网页中每个元素都可以产生某些JavaScript的事件
例如我们可以给按钮进行设置
使用户在点击按钮的时候 发生一个事件
然后取执行操作

二、事件三要素

1 事件源 触发事件的元素 可以理解为 某个触发事件的人 (谁)
2 事件类型 可以理解为触发什么事情 例如 点击事件 click
3 事件处理程序 事件触发后要执行的代码(以函数的形式),事件处理函数 相当于做什么
简单理解为
事件三要素 = 谁(事件源)+什么事件(事件类型)+(做)事件处理程序
案例如下

 var div = document.querySelector("div");
      //  鼠标经过
      div.onmouseover = function () {
        this.style.backgroundColor = "blue";
      };

三、执行事件的步骤

1 先获取事件源
2 注册事件
3 添加事件处理程序

  获取事件源
  var div = document.querySelector("div");
           
       div.onmouseout 注册事件 = function () {
       添加事件处理程序
       this.style.backgroundColor = "pink";
      };

四 、常见的鼠标事件

click 鼠标点击左键触发
dblclick 鼠标双击
mouseover 鼠标经过触发
mouseout 鼠标离开触发
focus 获取鼠标焦点时候触发
blur 失去鼠标焦点时触发
mousemove 鼠标移动触发
mouseup 鼠标弹起特效
mousedown 鼠标按下时触发

举报

相关推荐

0 条评论