事件(event)

1.什么是JavaScript事件?

  事件是文档或浏览器中发生的特定交互瞬间。

2.事件流

  事件流描述的是从页面中接受事件的顺序,包含IE提出的事件冒泡流与Netscape提出的事件捕获流。浏览器默认的是事件冒泡流。

两种思想:

  IE的事件流叫做事件冒泡,即事件开始时由最具体的元素接受,然后逐级向上传播到较为不具体的节点。

   Netscape团队提出的另一种事件流叫做事件捕获。事件捕获的思想是不太具体的DOM节点应该更早接收到事件,而最具体的节点应该最后接收到事件。

3.事件处理程序

  为事件指定处理程序的方式有好几种。 HTML事件处理程序。 即我们直接在HTML代码中添加事件处理程序,

  eg:<input id="btn1" value="按钮" type="button" onclick="showmsg();">   

    <script>

        function showmsg(){

          alert("HTML添加事件处理");

        }   

    </script>

  从上面的代码中我们可以看出,事件处理是直接嵌套在元素里头的,这样有一个毛病:就是html代码和js的耦合性太强,如果哪一天我想要改变js中showmsg,那么我不但要再js中修改,我还需要到html中修改。

  (1)DOM0级事件处理程序
    即为指定对象添加事件处理, 如:
    <input id="btn2" value="按钮" type="button">
    <script>
      var btn2= document.getElementById("btn2");
       btn2.onclick=function(){
         alert("DOM0级添加事件处理");
      }
      btn.onclick=null;//如果想要删除btn2的点击事件,将其置为null即可
  </script>

  (2)DOM2级事件处理程序 DOM2级事件定义了两个方法,用于处理指定和删除事件处理程序的操作:addEventListener()和removeEventListener()。所有DOM节点中都包含这两个方法,并且它们都接受3个参数:要处理的          事件名,做为事件处理程序的函数和一个布尔值。最后这个参数如果是true,表示在捕获阶段调用事件处理程序;如果是fasle,表示在冒泡阶段调用事件处理程序。

JavaScript中对事件简单的理解的更多相关文章

  1. JavaScript中对事件简单的理解(1)

    事件(event) 1.什么是JavaScript事件? 事件是文档或浏览器中发生的特定交互瞬间. 2.事件流 事件流描述的是从页面中接受事件的顺序,包含IE提出的事件冒泡流与Netscape提出的事 ...

  2. JavaScript中对事件简单的理解(2)

    事件(event) event对象 (1)什么是event对象? Event 对象代表事件的状态,比如事件在其中发生的元素.键盘按键的状态.鼠标的位置.鼠标按钮的状态.事件通常与函数结合使用,函数不会 ...

  3. 深入理解javascript中的事件循环event-loop

    前面的话 本文将详细介绍javascript中的事件循环event-loop 线程 javascript是单线程的语言,也就是说,同一个时间只能做一件事.而这个单线程的特性,与它的用途有关,作为浏览器 ...

  4. 了解javascript中的事件(二)

    本文目录如下: 零.寒暄 一.事件的分类 二.事件代理 2.1 问题引出 2.2 什么是事件代理 2.3 完整示例 二.事件代理 三.事件代理思想的用处 四.总结 零.寒暄 这篇博客本该出现在两个月以 ...

  5. JavaScript中的事件循环机制跟函数柯里化

    一.事件循环机制的理解 test();//按秒输出5个5 function test() { for (var i = 0; i < 5; i++) { setTimeout(() => ...

  6. JavaScript中的事件对象

    JavaScript中的事件对象 JavaScript中的事件对象是非常重要的,恐怕是我们在项目中使用的最多的了.在触发DOM上的某个事件时,会产生一个事件对象event,这个对象中包含这所有与事件有 ...

  7. js实例分析JavaScript中的事件委托和事件绑定

    我们在学习JavaScript中,难免都会去网上查一些资料.也许偶尔就会遇到“事件委托”(也有的称我“事件代理”,这里不评论谁是谁非.以下全部称为“事件委托”),尤其是在查JavaScript的事件处 ...

  8. JavaScript中的事件委托机制跟深浅拷贝

    今天聊下JavaScript中的事件委托跟深浅拷贝 事件委托 首先呢,介绍一下事件绑定 //方法一:通过onclick <button onclick="clickEvent()&qu ...

  9. javascript 中的事件机制

    1.javascript中的事件. 事件流 javascript中的事件是以一种流的形式存在的. 一个事件会也有多个元素同时响应. 有时候这不是我们想要的效果, 我们只是需要某个特定的元素相应我们的绑 ...

随机推荐

  1. WireShake的使用

    转自点击打开链接 之前写过一篇博客:用 Fiddler 来调试HTTP,HTTPS. 这篇文章介绍另一个好用的抓包工具wireshark, 用来获取网络数据封包,包括http,TCP,UDP,等网络协 ...

  2. 自行控制loadrunner的socket协议性能测试 (转)

    一前言 二任务的提出 三实现方案讨论 四技术要点讲解 如何开始录制一个最简单的收发数据包脚本 写日志文件 一行一行读数据包文件 字符串转换为十六进制数据包 发送自己定义的数据包 接收数据包到自定义缓冲 ...

  3. Python人体肤色检测

    代码地址如下:http://www.demodashi.com/demo/12967.html Python人体肤色检测 概述 本文中的人体肤色检测功能采用 OpenCV 库实现, OpenCV是一个 ...

  4. codeforces #550D Regular Bridge 构造

    题目大意:给定k(1≤k≤100),要求构造一张简单无向连通图,使得存在一个桥,且每一个点的度数都为k k为偶数时无解 证明: 将这个图缩边双,能够得到一棵树 那么一定存在一个叶节点,仅仅连接一条桥边 ...

  5. 一个请求在Struts2框架中的处理的步骤

  6. FileNotFoundException: http:\localhos46087125.jpg (文件名、目录名或卷标语法不正确

    java.io.FileNotFoundException: http:\localhost:8080\ipms\upload\1332146087125.jpg (文件名.目录名或卷标语法不正确.) ...

  7. codeforces Round #Pi (div.2) 567ABCD

    567A Lineland Mail题意:一些城市在一个x轴上,他们之间非常喜欢写信交流.送信的费用就是两个城市之间的距离,问每个城市写一封信给其它城市所花费的最小费用和最大的费用. 没什么好说的.直 ...

  8. Atitit。sql2016标准化的规划方案 v3 q2a

    Atitit.sql2016标准化的规划方案 v3 q2a 1. Sql标准化的历史3 1.1. Sql92标准4 1.2. Sql99标准4 1.3. SQL:2003为例,它包括以下9个部分 5 ...

  9. 集成学习1-Boosting

    转自http://blog.csdn.net/lvhao92/article/details/51079018 集成学习大致分为两类,一类串行生成.如Boosting.一类为并行化.如Bagging和 ...

  10. 转:关于安卓多线程while(true)方法占用CPU高的原因及其解决方法

    由于项目需要用到安卓多线程操作,结果开了四条线程,下载到平板一直很卡,CPU占用率暴涨.于是开始查找原因,发现是线程run()方法里的while(true)导致的, 下图是为解决时开启一条while( ...