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

最新推荐文章于 2024-02-09 18:10:17 发布

achjiang

最新推荐文章于 2024-02-09 18:10:17 发布

阅读量9.9k

点赞数 4

分类专栏：前端文章标签： js

原文链接：https://www.cnblogs.com/liaohongwei/p/9717511.html

版权

前端专栏收录该内容

5 篇文章 0 订阅

订阅专栏

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

转载自：https://www.cnblogs.com/liaohongwei/p/9717511.html

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>

achjiang

关注

4
点赞
踩
11

收藏

觉得还不错? 一键收藏
0
评论
js最常用的click事件3种方法

js最常用的click事件3种方法转载自：https://www.cnblogs.com/liaohongwei/p/9717511.html1. onclick=name()<!DOCTYPE html><html leng="en"> <head> <meta charset="utf-8"> &l...
复制链接

扫一扫