[DOM Event Learning] Section 2 概念梳理 什么是事件 DOM Event   事件 事件(Event)是用来通知代码,一些有趣的事情发生了. 每一个Event都会被一个Event对象所表示,这个对象可能还会有一些自定义的字段或者方法,来获取发生什么事情的更多信息. Event对象实现了Event接口(https://developer.mozilla.org/en-US/docs/Web/API/Event).   事件可以是任何事情,从最基本的用户交互,到rend…
[DOM Event Learning] Section 4 事件分发和DOM事件流 事件分发机制: event dispatch mechanism. 事件流(event flow)描述了事件对象在数据结构中是如何传播的.   传播路径 事件对象(event objects)被分发给事件目标(event target),在分发开始的时候,在实现中必须先确定事件对象的传播路径. 这个传播路径必须是一个有序的list,其中包含了事件对象必须通过的事件目标.   对于DOM的实现来说,这个传播路径必…
[DOM Event Learning] Section 3 jQuery事件处理基础 on(),off()和one()方法使用   jQuery提供了简单的方法来向选择器(对应页面上的元素)绑定事件处理器(event handlers). 当一个事件发生,提供的function就被执行,在方法里面,this代表当前的元素. 这些事件通常是由于用户和页面的交互而被激发,比如文字输入到表单元素,鼠标指针移动等.也有一些情况,比如页面load和unload的事件,是由浏览器本身来激发. 关于Even…
[DOM Event Learning] Section 1 DOM Event处理器绑定的几种方法   网页中经常需要处理各种事件,通常的做法是绑定listener对事件进行监听,当事件发生后进行一些特定处理. 监听事件的几种方法如下文.   第一种,写在页面标签里面 <button onclick="alert('Hello')">Say hello</button> 上面这行代码,将按钮点击后的弹窗操作在标签声明的时候就绑定了. 这是一种糟糕的方法,原因如…
事件循环(Event Loop),是每个JS开发者都会接触到的概念,但是刚接触时可能会存在各种疑惑. 众所周知,JS是单线程的,即同一时间只能运行一个任务.一般情况下这不会引发问题,但是如果我们有一个耗时较多的任务,我们必须等该任务执行完毕才能进入下一个任务,然而等待的这段时间常常让我们无法忍受,因为我们这段时间什么都不能做,包括页面也是锁死状态. 好在,时代在进步,浏览器向我们提供了JS引擎不具备的特性:Web API.Web API包括DOM API.定时器.HTTP请求等特性,可以帮助我们…
一:jquery基本概念 1.jquery是一个javascript框架,它是一个轻量级的js库 2.当下流行的js库有: jquery MooTools Prototype 3.$(ducoment) 表示一个jquery对象 4.引入jquery库: <script type="text/javascript" src="jquery-3.3.1.js"></script> 5.jquery对象是对dom对象的一系列包装 6.jquery…
1. event :Something that happens during your application that requires a response. 2.event object:The concrete representation of an event in wxPython including data attributes that encapsulate the specifics of the event. Events are represented as ins…
前言:之前在学习事件对象event时,一是一直在chrome浏览器(作为主运行环境)下运行调试自个儿程序,二是可能当时对事件对象理解不透彻才导致现在对事件对象的用法陷入了一个大坑,遂以此篇博客记之. 基本知识梳理:事件对象:在触发DOM上某个事件时,会产生一个事件对象event,这个对象中包含着所有与事件有关的信息,浏览器会将一个event对象传入到事件处理程序中. mouseenter:在鼠标光标从外部元素首次移动到元素范围之内时触发.这个事件不冒泡. mouseleave:在位于元素上方的鼠…
JavaScript 中的事件对象(event) 当我们每次触发一种事件(如点击事件),我们会在回调函数中传入事件对象event.今天就来来谈谈. 1.当我们想判断当前事件是我们想要的事件类型时,可以使用type属性,表示当前事件的类型,如click,mousedown,mouseup等: 2.当我们想获取当前的坐标可以使用clientX和clienY,offsetX和offsetY,pageX和pageY,screenX和screenY. client:以浏览器(当前窗口)左上角为参考点(所以…
本文最初发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. 绑定事件的两种方式 我们在上一篇文章中已经讲过事件的概念.这里讲一下注册事件的两种方式,我们以onclick事件为例. 方式一:onclick 举例: <body> <button>点我</button> <script> var btn = document.getElementsByTagName("button&qu…