1. Javascript事件介绍

JavaScript中的事件和现实生活中的事件类似,现实生活中发生的一些事情,例如:交通事件,当这些事情发生时,我们需要提供处理方案:

在JavaScript中事件,指的是用户 和网页发生交互时的一些行为,例如:鼠标点击、按下键盘按键、鼠标移动,这些行为就称之为事件,事件发生时,我们的程序也应该提供对应的处理方法

2. Javascript事件分类

鼠标事件,通过鼠标和网页进行交互

click()   鼠标单击

dblclick() 鼠标双击

mouseover() 鼠标移入事件

mouseout()   鼠标移出事件

mousemove() 鼠标移动事件

mousedown() 鼠标按下事件

mouseup()   鼠标按键被松开事件

scroll            滚动事件(body)

键盘事件,通过键盘上的按键和网页进行交互

keydown    按键被按下

keyup         按键抬起

表单事件,提交表单时

submit 表单提交事件

select    文本框的文本被选中

focus 获得焦点事件

blur 失去焦点事件

change 内容改变事件

页面加载完毕事件:

load

3. Javascript事件监听

我们需要先监视网页上用户的这些行为,这样,当行为发生的时候,我们才能提供相应的处理方法,如果不监视,就无法获得用户的这些行为

HTML事件监听程序

将监视器(摄像头),绑定到html的标签部分,作为html标签的属性

举例演示:

DOM0级事件监听程序

将事件监听器(摄像头),绑定到DOM节点对象上,也就是作为DOM对象的属性存在

DOM2级事件监听程序

通过DOM对象.addEventListener(),针对主流浏览器(ie9+  Chrome、Firefox登录),非主流浏览器(IE6、7、8)使用attachEvent方法进行绑定

通常在使用DOM3级事件绑定程序的时候,先判断一下是否是主流浏览器

将封装DOM2级的方法封装起来

思想:将重复性的代码提取出来,将将来可能会变的地方通过传递参数实现

将来我们在使用的时候:

JavaScript事件(随笔)的更多相关文章

  1. JavaScript事件代理和委托(Delegation)

    JavaScript事件代理 首先介绍一下JavaScript的事件代理.事件代理在JS世界中一个非常有用也很有趣的功能.当我们需要对很多元素添加事件的时候,可以通过将事件添加到它们的父节点而将事件委 ...

  2. JavaScript事件概览

    JavaScript事件 JavaScript是单线程,在同一个时间点,不可能同时运行两个"控制线程". 事件句柄和事件对象 1.注册事件句柄 标准和非标准 var button= ...

  3. 【移动端兼容问题研究】javascript事件机制详解(涉及移动兼容)

    前言 这篇博客有点长,如果你是高手请您读一读,能对其中的一些误点提出来,以免我误人子弟,并且帮助我提高 如果你是javascript菜鸟,建议您好好读一读,真的理解下来会有不一样的收获 在下才疏学浅, ...

  4. JavaScript 事件

    事件 概念:事件是可以被 JavaScript 侦测到的行为. JavaScript 使我们有能力创建动态页面.事件是可以被 JavaScript 侦测到的行为. 网页中的每个元素都可以产生某些可以触 ...

  5. JavaScript事件详解-jQuery的事件实现(三)

    正文 本文所涉及到的jQuery版本是3.1.1,可以在压缩包中找到event模块.该篇算是阅读笔记,jQuery代码太长.... Dean Edward的addEvent.js 相对于zepto的e ...

  6. JavaScript事件详解-Zepto的事件实现(二)【新增fastclick阅读笔记】

    正文 作者打字速度实在不咋地,源码部分就用图片代替了,都是截图,本文讲解的Zepto版本是1.2.0,在该版本中的event模块与1.1.6基本一致.此文的fastclick理解上在看过博客园各个大神 ...

  7. 总结JavaScript事件机制

    JavaScript事件模型 在各种浏览器中存在三种事件模型: 原始事件模型 , DOM2事件模型 , IE事件模型. 其中原始的事件模型被所有浏览器所支持,而DOM2中所定义的事件模型目前被除了IE ...

  8. 解析Javascript事件冒泡机制

    本资源引自: 解析Javascript事件冒泡机制 - 我的程序人生 - 博客频道 - CSDN.NET http://blog.csdn.net/luanlouis/article/details/ ...

  9. JavaScript事件流原理解析

    一.为什么会有这一篇的文章 国庆前几天由于任务比较重,要赶在国庆前把一个进度的任务开发完成,所以也就有点赶,但是却遇到了一个比较奇怪的Bug,导致了任务比预计的延迟了几个小时,对此深表遗憾,所以利用国 ...

随机推荐

  1. IK的整个分词处理过程

    首先,介绍一下IK的整个分词处理过程: 1. Lucene的分词基类是Analyzer,所以IK提供了Analyzer的一个实现类IKAnalyzer.首先,我们要实例化一个IKAnalyzer,它有 ...

  2. C盘清理记——罪魁Visual Studio

    话不啰嗦,单刀直入:在C:\ProgramData\Microsoft Visual Studio文件夹下,VS会自动记录IntelliTrace File,久而久之,会无限消耗磁盘空间,直接到塞满C ...

  3. Erlang学习记录:相关工具和文档

    在线工具和文档 网址 说明 OTP Reference Page Index 内置模块查询 Erlang/OTP Applications N Kernel Reference Manual 入门官方 ...

  4. thinkphp5+GatewayWorker+Workerman

    项目地址  ttps://www.workerman.net/workerman-chat thinkphp5+GatewayWorker+Workerman聊天室,可以多人聊天,指定某个人进行聊天, ...

  5. 【JZOJ6370】基础 fake 练习题

    description 装饰者坐在树荫下听着长者讲述以前的故事: 大神 yk 非常喜欢树,便钦点班里的 n 个小蒟蒻站在一棵 n 个点以 1 为根的树上,并且每个点上恰好有 1 个小蒟蒻. 大神 yk ...

  6. 解析JQuery Ajax

    jQuery是一个挺好的轻量级的JS框架,能帮助我们快速的开发JS应用,并在一定程度上改变了我们写JavaScript代码的习惯. 先来看一些简单的方法,这些方法都是对jQuery.ajax()进行封 ...

  7. C++利用动态数组实现顺序表(不限数据类型)

    通过类模板实现顺序表时,若进行比较和遍历操作,模板元素可以通过STL中的equal_to仿函数实现,或者通过回调函数实现.若进行复制操作,可以采用STL的算法函数,也可以通过操作地址实现.关于回调函数 ...

  8. 第十一篇:一点一滴学ibatis(一)

    一.常见ORM框架1.原生的JDBC.自己写的JDBC,基本上就只够程序跑起来,缺陷和漏洞一堆堆.回顾下jdbc的几个操作,加载驱动,建立连接,预处理语句,执行,结果集遍历.这个过程中,因为连接Con ...

  9. POJ 3348 /// 凸包+多边形面积

    题目大意: 给定的n个点 能圈出的最大范围中 若每50平方米放一头牛 一共能放多少头 求凸包 答案就是 凸包的面积/50 向下取整 /// 求多边形面积// 凹多边形同样适用 因为点积求出的是有向面积 ...

  10. NEO4J全文检索架构

    NEO4J全文检索架构 一.有大量存量数据(亿级以上)(并长期有增量数据进入) 二.无大量存量数据或者少量存量数据(或全部为增量数据) 三.架构方案选择优先级 以下方案,是根据实践总结的基于NEO4J ...