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

2021/6/7 20:51:06

编程Tag： javascript element function console 绑定 test click 内置 log

本文主要是介绍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>

这篇关于JavaScript内置对象事件的三种绑定方式的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！

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

相关编程文章