事件监听和委托 初入jquery

事件监听  addEventListener()

    参数1：事件类型

    参数2：触发事件后执行的函数

    参数3：布尔值。默认值为false，按照事件冒泡顺序；true为事件捕获

删除事件监听    removeEventListener()

    注意事项：1.相同元素调用

                     2.相同事件名称

                     3.相同函数名(不能用匿名函数，需要全局函数)

                     4.相同的执行阶段

普通事件绑定与事件监听的区别：

    1.普通事件绑定只能给元素相同类型的事件绑定一个，如果绑定第二个，会覆盖掉第一个

       事件监听可以给同一个元素的相同类型事件绑定多个

    2.事件监听可以控制事件的传播方式(事件捕获或事件冒泡)

    3.事件监听可以通过删除的方法，来取消事件；普通绑定只能通过null来取消

    4.添加事件监听可以对动态生成的元素(未来元素)生效，而普通事件不可以

事件委托

    利用事件冒泡机制指定一个事件处理程序，来管理某一类型的所有事件。

    即利用冒泡的原理，把事件加到父级上，触发执行效果

优点:

    1.只在内存中开辟了一块空间，节省资源的同时，减少了Dom操作，提高性能

    2.对于新添加的元素也会有之前的事件

JQuery

    js的变量 ：var a = 10;

    jq的变量：var $a = 10; （$ 声明该变量是jq变量  同时$也是JQuery的简写）

  dom的变量 和 jq的变量之间 转换

      1. 转换为jq变量

        var $b = $(document.getElementsByClassName("box")[0]);

      2. 转换为DOM变量

        var $c = $b[0];