<!DOCTYPE html>

<html lang="zh">

<head>

    <meta charset="UTF-8">

    <title>js中的点击事件（click）的实现方式</title>

</head>

<body>

    <!-- 第三种方式-->

    <button id="btn" onclick="threeFn()">点我</button>

    <script type="text/javascript">

        var btn = document.getElementById("btn");

        // 第一种 通过点击事件

        btn.onclick = function(){

            alert("这是第一种点击方式");

        }

        // 第二种 监听点击事件

        btn.addEventListener('click', function(){

            alert("这是第二中点击方式");

        })

        // 第三种 通过方法响应点击事件

        function threeFn(){

            alert("这是第三种点击方式");

        }

    </script>

</body>

</html>

js中的点击事件（click）的实现方式的更多相关文章

  1. bootstrap table 生成的表格里动态添加HTML元素按钮，JS中添加点击事件，点击没反应---解决办法

    bootstraptable中onExpandRow属性---js  方法添加的 html代码,然后给这代码里面的 元素 添加 事件,却获取不该元素.(称之为未来元素),由于是未来的 所以现在没有这个 ...

  2. vue中Enter触发登录事件和javascript中Enter触发点击事件

    created(){ window.addEventListener('keydown', this.handleKeyDown, true)//开启监听键盘按下事件 } 在methods中当keyC ...

  3. js触发按钮点击事件

    js触发按钮点击事件 博客分类: javascript   模拟JS触发按钮点击功能 <html> <head> <title>usually function&l ...

  4. qtp不识别树结构中的点击事件

    qtp不识别树结构中的点击事件,未生成该点击事件的脚本,解决办法: 1.未生成点击"auto分类c1"的脚本 2.点击1.对象库-2.添加对象库-3.选中对象-点击OK,即将该对象 ...

  5. 关于在"a"标签中添加点击事件的一些问题

    昨天做修改页面跳转时遇到一个问题,如果a标签的"href"属性为空的话,比如这样<a href="" onclick="roleupdate() ...

  6. jquery中交替点击事件toggle方法的使用示例

    jquery中交替点击事件toggle方法中有两个参数,分别是要交替执行的事件.如果不传参默认是显示隐藏功能,下面有个不错的示例,感兴趣的朋友可以参考下 复制代码代码如下: $('#clickId‘) ...

  7. js input radio点击事件

    html代码: <input type="radio" name="myname" value="1" />1 <inpu ...

  8. android点击事件的四种方式

    android点击事件的四种方式 第一种方式:创建内部类实现点击事件 代码如下: package com.example.dail; import android.text.TextUtils; im ...

  9. js for循环中点击事件中无法获取每一个i值的问题

    好像是第二次遇到这个问题,必须要总结一下!! <!DOCTYPE html> <html> <head> <meta charset="utf-8& ...

随机推荐

  1. 字典树 trie树 学习

    一字典树 字典树,又称单词查找树,Trie树,是一种树形结构,哈希表的一个变种   二.性质 根节点不包含字符,除根节点以外的每一个节点都只包含一个字符: 从根节点到某一节点,路径上经过的字符串连接起 ...

  2. Linux基本命令 网络命令

    概述 网络和监控命令类似于这些: hostname, ping, ifconfig, iwconfig, netstat, nslookup, traceroute, finger, telnet, ...

  3. Android开发BUG及解决方法

    错误描述 问题1: 按照提示打开gradle-wrapper.properties文件 并且将gradle-2.8-all.zip改为gradle-2.10-all.zip,重新导入项目 问题2: 却 ...

  4. 写给后端程序员的HTTP缓存原理介绍--怎样决定一个资源的Cache-Control策略呢

    通过Internet获取资源既缓慢,成本又高.为此,Http协议里包含了控制缓存的部分,以使Http客户端可以缓存和重用以前获 取的资源,从而优化性能,提升体验.虽然Http中关于缓存控制的部分,随着 ...

  5. 线性代数：Ax=b的解

    n列的矩阵A,当且仅当向量b是列空间C(A)的一个向量时,Ax=b有解. C(A)的零空间是N(A),N(A)正交补是A的行空间C(T(A)), 依据上一章的结论,任何Rn向量可以表示为r+n,其中n ...

  6. Service Meth and SideCar

    本文转自:http://philcalcado.com/2017/08/03/pattern_service_mesh.html SideCar: SideCar就是与Application一起运行的 ...

  7. Docker 三剑客

    Docker三剑客: Docker-Machine Docker Machine is a tool that lets you install Docker Engine on virtual ho ...

  8. [转载]解析 Java 类和对象的初始化过程

    原文地址:http://www.ibm.com/developerworks/cn/java/j-lo-clobj-init/index.html 由一个单态模式引出的问题谈起 类的初始化和对象初始化 ...

  9. 整体二分learning

    整体二分是一个离线的做法  目前可以解决求区间第k大问题 当然划分树主席树都可以的样子.. 为什么我老学一些解决同种问题的算法.. 主要思想大概是这样的: 如果要求[l,r]的区间第K大 而这个区间内 ...

  10. Ant入门

    一.Ant介绍 Ant是Java的生成工具,是Apache的核心项目:直接在apache官网下载即可: Ant类似于Unix中的Make工具,都是用来编译.生成: Ant是跨平台的,而Make不能: ...