JS----click3种方法

本文转载自查看原文 2018-09-28 11:07 3539 javascript

js最常用的click事件3种方法

1、onclick=name()

<!DOCTYPE html>
<html leng="en">
    <head>
        <meta charset="utf-8">
        <title>one</title>
    </head>
    <body>
        <div id="dome"></div>
        <button type="button" onclick="displayDate()">点击</button>
        <script>
            function displayDate(){
                document.getElementById("dome").innerHTML=Date();
            }
        </script>
    </body>
</html>

2、js中绑定

<!DOCTYPE html>
<html leng="en">
    <head>
        <meta charset="utf-8">
        <title>one</title>
    </head>
    <body>
        <div id="dome"></div>
        <button type="button">点击</button>
        <script>
            var btn=document.getElementById("btn");
            btn.onclick=function(){
                document.getElementById("dome").innerHTML=Date();
            }
        </script>
    </body>
</html>

3、事件柄方法

//addEventListener 用于向指定元素添加事件句柄

//可以向一个元素添加多次点击事件，后一个点击事件不会覆盖前一个点击事件

<!DOCTYPE html>
<html leng="en">
    <head>
        <meta charset="utf-8">
        <title>one</title>
    </head>
    <body>
        <div id="dome"></div>
        <button type="button">点击</button>
        <script>
            var btn=document.getElementById("btn");
            btn.addEventListener('click',function(){
                document.getElementById("dome").innerHTML=Date();
            },false)
        </script>
    </body>
</html>

免责声明！

本站转载的文章为个人学习借鉴使用，本站对版权不负任何法律责任。如果侵犯了您的隐私权益，请联系本站邮箱yoyou2525@163.com删除。

猜您在找 js继承的6种方法 js排序的2种方法,好用 JS阻止事件冒泡的3种方法 JS数组去重的三种方法 JS函数调用（4种方法） HTML用JS导出Excel的五种方法页面自动执行js的3种方法 js倒计时的2种方法 js数组去重4种方法 JS生成 UUID的四种方法