事件模型总结

一 EvenTarget接口

        1绑定事件的监听函数
        var japan = document.getElementById('japan');
        function jp() {
            console.log('hello');
        }
        japan.addEventListener('click',jp);
        
       2 移除事件的监听函数
        var china = document.getElementById('china');
        china.addEventListener('click',function() {
            japan.removeEventListener('click',jp)
        });

       

二 监听函数

        HTML标签的on-属性，直接定义某些事件的监听代码。

       需要在列如：<div id=""  onclick="ind()"></div>定义（一般推荐使用，一目了然，且不需要像其他方法获取节点）

        function ind() {
            console.log('world');
        }
        
        Element节点的事件属性，同样可以指定监听函数。
        var korea = document.getElementById('korea');
        korea.onclick = function () {
            console.log('hello');

        }

三 事件种类

        click，dblclick（双击），mousedown（鼠标按下），mousemove（某个区域移动）

        捕获与冒泡

       走势图

        (第一     第二        第三     第四）捕获false

      （第四     第三        第二      第一）冒泡true

        function mydivi() {
            console.log('我是div');
        }//第二输出
        document.body.addEventListener('click',function() {
            console.log('我是body 冒泡')},false
        );//第三输出
        document.body.addEventListener('click',function() {
            console.log('我是body 捕获')},true
        );//第一输出