JavaScript基础----24JS事件详解-事件处理

来源：互联网发布：手机网络打印机编辑：程序博客网时间：2024/05/22 03:38
<!DOCTYPE html><!-- JS事件详解-事件处理--><html><head lang="en">    <meta charset="UTF-8">    <title></title></head><body><!--html事件的处理，缺点：函数名修改后，调用函数的地方也要修改--><!--<div id = "div">-->    <!--<button id="btn1" onclick=" demno()">按钮</button>--><!--</div>--><!--<script>-->    <!--function demno(){-->        <!--alert("html事件处理")-->    <!--}--><!--</script>--><!--dom0级事件处理--><!--<button id="btn1" onclick=" demno()">按钮</button>--><!--<script>--><!--var btn =document.getElementById("btn1");--><!--//匿名函数，匿名函数会立刻执行--><!--btn.onclick = function(){alert("dom0级事件处理1")};//被覆盖掉了--><!--btn.onclick = function(){alert("dom0级事件处理2")};//只显示最后一个事件--><!--//    btn.onclick=null;//清除事件--><!--</script>--><!--dom2级事件处理程序--><!--<button id="btn1" onclick=" demno()">按钮</button>--><!--<script>-->    <!--//里面的函数没有名称-->   <!--var btn1 = document.getElementById("btn1").addEventListener("click",function(){-->       <!--alert("2级处理");-->   <!--})--><!--</script>--><!--dom2级事件处理程序，把函数去出来，加上名字--><!--<button id="btn1" onclick=" demno()">按钮</button>--><!--<script>-->    <!--//里面的函数没有名称，把上面的函数取出来，则要你给加上名称-->    <!--var btn1 = document.getElementById("btn1").addEventListener("click",demo);-->    <!--function demo(){-->        <!--alert("dom2级事件处理程序")-->    <!--}--><!--</script>--><!--dom2级事件处理程序，给button多加监听--><button id="btn1" onclick=" demno()">按钮</button><script>    //里面的函数没有名称，把上面的函数取出来，则要你给加上名称    var btn1 = document.getElementById("btn1");    btn1.addEventListener("click",demo1);//添加事件    btn1.addEventListener("click",demo2);//    下面的相当于这种样子。//    var demo1= function (){    //    //    };//    var demo1= function aaa (){////        };    function demo1(){        alert("dom2级事件处理程序1")    }    function demo2(){        alert("dom2级事件处理程序2")    }//  移除事件    btn1.removeEventListener("click",demo2);</script><!--判断多级事件，兼容所有浏览器--><!--<button id="btn1" onclick=" demno()">按钮</button>--><!--<script>-->    <!--var btn1 =document.getElementById("btn1");-->    <!--if(btn1.addEventListener){-->        <!--btn1.addEventListener("click",demo);-->    <!--}else if(btn1.attachEvent){-->        <!--btn1.attachEvent("click",demo);-->    <!--}else{-->        <!--btn1.onclick=demo();-->    <!--}-->    <!--function demo(){-->        <!--alert("hello");-->    <!--}--><!--</script>--></body></html>
0 0