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>

JS----click3种方法的更多相关文章

  1. 原生Js 两种方法实现页面关键字高亮显示

    原生Js 两种方法实现页面关键字高亮显示 上网看了看别人写的,不是兼容问题就是代码繁琐,自己琢磨了一下用两种方法都可以实现,各有利弊. 方法一 依靠正则表达式修改 1.获取obj的html2.统一替换 ...

  2. jquery动态加载js三种方法实例

    这里为你提供了三种动态加载js的jquery实例代码哦,由于jquery是为用户提供方便的,所以利用jquery动态加载文件只要一句话$.getScript(\"test.js\" ...

  3. iframe-父子-兄弟页面相互传值(jq和js两种方法)

    参考文章: http://blog.csdn.net/u013299635/article/details/78773207 http://www.cnblogs.com/xyicheng/archi ...

  4. WordPress引入css/js两种方法

    WordPress引入css/js 是我们制作主题时首先面对的一个难点,任何一款主题都要加载自己的css,js,甚至很有可能还需要加载Jquery文件,网上方法特多,说法不一,我们今天借鉴wordpr ...

  5. url地址数据参数转化JSON对象（js三种方法实现）

    当我们用get方法提交表单时,在url上会显示出请求的参数组成的字符串,例如:http://localhost:3000/index.html?phone=12345678901&pwd=12 ...

  6. JS四种方法去除字符串最后的逗号

    <script> window.onload=function() { var obj = {name: "xxx", age: 30, sex: "fema ...

  7. JavaScript模板引擎artTemplate.js——两种方法实现性别的判定

    template.helper(name, callback) name:必传,辅助事件的名称. callback:必传,辅助事件的回调函数. return:undefined 所谓的辅助事件,主要用 ...

  8. js三种方法添加image

    1 var img = new Image(); 2 var img = document.createElement('image'); 3 img.innerHtml = '<img src ...

  9. JS 判断数据类型的三种方法

    说到数据类型,我们先理一下JavaScript中常见的几种数据类型: 基本类型:string,number,boolean 特殊类型:undefined,null 引用类型:Object,Functi ...

  10. js数组去重的4种方法

    js数组去重,老生长谈,今天对其进行一番归纳,总结出来4种方法 贴入代码前 ,先对浏览器Array对象进行支持indexOf和forEach的polyfill Array.prototype.inde ...

随机推荐

  1. Linux Git install

    1.介绍 使用Coding管理项目,上面要求使用的git版本为1.8.0以上,而很多yum源上自动安装的git版本为1.7,所以需要掌握手动编译安装git方法. 2.安装git依赖包 yum inst ...

  2. kafka 消息系统

    一.为什么需要消息系统 1.解耦: 允许你独立的扩展或修改两边的处理过程,只要确保它们遵守同样的接口约束. 2.冗余: 消息队列把数据进行持久化直到它们已经被完全处理,通过这一方式规避了数据丢失风险. ...

  3. jvm 内存分配 （转）

    深入理解JVM—JVM内存模型  http://www.cnblogs.com/dingyingsi/p/3760447.html 我们知道,计算机CPU和内存的交互是最频繁的,内存是我们的高速缓存区 ...

  4. 16.Mongodb安装

    Mongodb是由c++编写的非关系型数据库,是一个基于分布式文件存储的开源数据库系统,其内容存储形式类似JSON对象,它的字段值可以包含其他文档.数组及文档数组,非常灵活. 1.相关链接: http ...

  5. <转载> js 闭包

    http://www.haorooms.com/post/js_bbtwo http://www.jb51.net/article/24101.htm http://www.cnblogs.com/f ...

  6. ELK测试安装

    https://blog.csdn.net/guyan0319/article/details/78749639 https://www.cnblogs.com/frankdeng/p/9139035 ...

  7. 2. 解决svn working copy locked问题

    解决办法: 产生这种情况大多是因为上次svn更新命令执行失败且被自动锁定了. 如果cleanup没有效果的话只好手动删除锁定文件. 就可以通过“运行”--“cmd”--cd 到svn项目的根目录下,然 ...

  8. java json字符串与对象转换

    下载引入包gson-2.0.jar 1.字符转数据 final Map map = new HashMap();map.put("contents",    "[{\&q ...

  9. Memcache操作类

    using Memcached.ClientLibrary; using System; using System.Collections.Generic; using System.Linq; us ...

  10. 如何轻松干掉svd(矩阵奇异值分解),用代码说话

    svd我认识我机器学习里面最扯淡的玩意了.尼玛.老实说,好多机器学习的书老是在扯svd有多高端,然后看了netflix电影推荐大赛,哇塞,冠军队就是用svd+做的.然后狠狠的下载了所有他们的论文,硬是 ...