JavaScript内置对象事件的三种绑定方式 

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <script>
            function test() {
                console.log("test");
            }
        </script>
    </head>
    <body>
    <!--on+对应事件 标签属性-->
        <button type="button" onclick="test()">按钮1</button>
        <input type="button" value="按钮2" id="bnt2"/>
        <script>
            var element = document.getElementById("bnt2");
            // element.onclick=test;
            element.onclick=function (){
                console.log("test")
            }
        </script>
        <!--id选择对应的element-->
        <input type="button" value="按钮3" id="bnt3"/>
        <script>
            var element = document.getElementById("bnt3");
            // element.addEventListener("click",test);
            element.addEventListener("click",function (){
                console.log("test");
            });
        </script>

    </body>
</html>

 

posted @ 2021-06-07 20:29  程序新人小刘  阅读(58)  评论(0)    收藏  举报