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. ubuntu 手动修改分辨率为1920 X 1080 的两种方式

    方案一(临时性,重启会失效): 1.打开终端.输入:cvt 1920 1080 出现有modeline 的提示. 2.使用 xrandr 创建新的 mode,--newmode 后面跟刚刚 cvt 产 ...

  2. centos7安装LNMP与Laravel遇到的一些小问题

    安装LNMP 第一次安装 yum update CentOS7下 Nginx1.13.5 + PHP7.1.10 + MySQL5.7.19 源码编译安装 安装mySQL时,mysqld: error ...

  3. 获取get请求后面的参数

    var str = "www.baidu.com?id=1&name=zhangsan"; var data = str.split("?"); con ...

  4. 初窥GPFS文件系统(转)

    原文地址:http://blog.csdn.net/jznsmail/article/details/5502840?reload 本作品采用知识共享署名-非商业性使用-相同方式共享 3.0 未本地化 ...

  5. 【Social listening实操】从社交媒体传播和文本挖掘角度解读《欢乐颂2》

    本文转自知乎 作者:苏格兰折耳喵 ----------------------------------------------------- 作为数据分析爱好者,本文作者将想从数据的角度去解读< ...

  6. Angular.js实现分页

    一.编写angularJS实现的分页js(网上搜)和样式表(pagination),并在页面引入 二.编写变量和方法 //分页控件控制 $scope.paginationConf={ currentP ...

  7. [Writeup]百度一下,你就知道

    [Writeup]百度一下,你就知道 谢邀@宋雨田 人在607,刚下床 育才上网,信号不好 实名diss,能人宋雷 ---------------------- 以下是原答案 ------------ ...

  8. layui动态options

    layui 坑 layui 针对各种表单元素做了较为全面的UI支持,你无需去书写那些 UI 结构,你只需要写 HTML 原始的 input.select.textarea 这些基本的标签即可.我们在 ...

  9. python中的递归小实例

    #1.n! def fact(n): if n == 0: return 1 else: return n*fact(n-1)print(fact(10)) #2.斐波那契数列F(n)=F(n-1)+ ...

  10. curl发送xml , xml和数组互转

    public function postXml($url, array $data) { // pack xml $xml = $this->arrayToXml($data); // curl ...