Javascript中绑定click事件的四种方式介绍


Posted in Javascript onOctober 26, 2018

一:HTML中添加onclick

<button id="vv" onclick="myfunction()" >哈哈</button>

二:JS中定义函数绑定事件!

var funcc = function () {
  alert('我爱编程')
  }
var aa = document.getElementById('vv')
aa.onclick = funcc

三:直接定义函数与内容

document.getElementById('vv').onclick = function () {
  alert('hasssshhaa ')
  }

四:利用addEventListener

document.getElementById('vv').addEventListener('click',funcc);
//或者:
document.getElementById('vv').addEventListener('click',function () {
  alert('hahah')
  })

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,谢谢大家对三水点靠木的支持。如果你想了解更多相关内容请查看下面相关链接

Javascript 相关文章推荐
JS 拼图游戏 面向对象,注释完整。
Jun 18 Javascript
jquery 多级下拉菜单核心代码
May 21 Javascript
jQuery中绑定事件的命名空间详解
Apr 05 Javascript
JS中实现replaceAll的方法(实例代码)
Nov 12 Javascript
node.js中的http.response.writeHead方法使用说明
Dec 14 Javascript
jQuery中each()、find()和filter()等节点操作方法详解(推荐)
May 25 Javascript
内容滑动切换效果jquery.hwSlide.js插件封装
Jul 07 Javascript
JS框架之vue.js(深入三:组件1)
Sep 29 Javascript
将Sublime Text 3 添加到右键中的简单方法
Dec 12 Javascript
BootStrap table实现表格行拖拽效果
Dec 01 Javascript
Angular中使用ng-zorro图标库部分图标不能正常显示问题
Apr 22 Javascript
vue发送websocket请求和http post请求的实例代码
Jul 11 Javascript
使用webpack打包后的vue项目如何正确运行(express)
Oct 26 #Javascript
jQuery Ajax实现Select多级关联动态绑定数据的实例代码
Oct 26 #jQuery
详解ES6 系列之异步处理实战
Oct 26 #Javascript
element-ui 的el-button组件中添加自定义颜色和图标的实现方法
Oct 26 #Javascript
angularjs通过过滤器返回超链接的方法
Oct 26 #Javascript
js使用formData实现批量上传
Mar 27 #Javascript
详解webpack打包时排除其中一个css、js文件或单独打包一个css、js文件(两种方法)
Oct 26 #Javascript
You might like
一个阿拉伯数字转中文数字的函数
2006/10/09 PHP
PHP仿博客园 个人博客(1) 数据库与界面设计
2013/07/05 PHP
PHP实现AES256加密算法实例
2014/09/22 PHP
php中解析带中文字符的url函数分享
2015/01/20 PHP
PHP生成唯一订单号的方法汇总
2015/04/16 PHP
JavaScript QueryString解析类代码
2010/01/17 Javascript
JS实现字体选色板实例代码
2013/11/20 Javascript
js使用for循环与innerHTML获取选中tr下td值
2014/09/26 Javascript
使用javascript获取页面名称
2014/12/23 Javascript
jquery中cookie用法实例详解(获取,存储,删除等)
2016/01/04 Javascript
JS运动相关知识点小结(附弹性运动示例)
2016/01/08 Javascript
轻松掌握JavaScript单例模式
2016/08/25 Javascript
微信小程序  简单实例(阅读器)的实例开发
2016/09/29 Javascript
分类解析jQuery选择器
2016/11/23 Javascript
浅谈javascript alert和confirm的美化
2016/12/15 Javascript
JavaScript 限制文本框不可输入英文单双引号的方法
2016/12/20 Javascript
anime.js 实现带有描边动画效果的复选框(推荐)
2017/12/24 Javascript
详解vue在项目中使用百度地图
2019/03/26 Javascript
浅谈对于“不用setInterval,用setTimeout”的理解
2019/08/28 Javascript
微信小程序制作扭蛋机代码实例
2019/09/24 Javascript
跟老齐学Python之让人欢喜让人忧的迭代
2014/10/02 Python
python 队列详解及实例代码
2016/10/18 Python
python科学计算之narray对象用法
2019/11/25 Python
tensorflow通过模型文件,使用tensorboard查看其模型图Graph方式
2020/01/23 Python
django rest framework serializer返回时间自动格式化方法
2020/03/31 Python
python进行OpenCV实战之画图(直线、矩形、圆形)
2020/08/27 Python
详解win10下pytorch-gpu安装以及CUDA详细安装过程
2021/01/28 Python
Python实现图片指定位置加图片水印(附Pyinstaller打包exe)
2021/03/04 Python
加拿大高尔夫超市:Golf Town
2018/01/12 全球购物
美国名表在线商城:Ashford(支持中文)
2019/09/24 全球购物
请编程遍历页面上所有 TextBox 控件并给它赋值为 string.Empty
2015/12/03 面试题
《水乡歌》教学反思
2014/04/24 职场文书
求职教师自荐书
2014/06/19 职场文书
2014年保卫部工作总结
2014/11/21 职场文书
2016全国“质量月”活动标语口号
2015/12/26 职场文书
Sleuth+logback 设置traceid 及自定义信息方式
2021/07/26 Java/Android