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展开闭合效果演示代码
Jul 24 Javascript
自己编写的类似JS的trim方法
Oct 09 Javascript
详解JavaScript中shift()方法的使用
Jun 09 Javascript
jQuery Validate表单验证深入学习
Dec 18 Javascript
学习使用grunt来打包JavaScript和CSS程序的教程
Jan 04 Javascript
理解JavaScript中Promise的使用
Jan 18 Javascript
Angular通过angular-cli来搭建web前端项目的方法
Jul 27 Javascript
详解基于vue-router的动态权限控制实现方案
Sep 28 Javascript
基于vue中css预加载使用sass的配置方式详解
Mar 13 Javascript
jQuery实现仿京东防抖动菜单效果示例
Jul 06 jQuery
Vue实现base64编码图片间的切换功能
Dec 04 Javascript
微信小程序的引导页实现代码
Jun 24 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
PHP得到mssql的存储过程的输出参数功能实现
2012/11/23 PHP
LazyLoad 延迟加载(按需加载)
2010/05/31 Javascript
json的前台操作和后台操作实现代码
2012/01/20 Javascript
JavaScript中:表达式和语句的区别[译]
2012/09/17 Javascript
JS随即打乱数组实现代码
2012/12/03 Javascript
如何将php数组或者对象传递给javascript
2014/03/20 Javascript
如何正确使用javascript 来进行我们的程序开发
2014/06/23 Javascript
使用documentElement正确取得当前可见区域的大小
2014/07/25 Javascript
js表头排序实现方法
2015/01/16 Javascript
jQuery实现将页面上HTML标签换成另外标签的方法
2015/06/09 Javascript
jQuery侧边栏实现代码
2016/05/06 Javascript
判断数组是否包含某个元素的js函数实现方法
2016/05/19 Javascript
javascript正则表达式之分组概念与用法实例
2016/06/16 Javascript
jquery学习笔记之无new构建详解
2017/12/07 jQuery
jquery应用实例分享_实现手风琴特效
2018/02/01 jQuery
详解@Vue/Cli 3 Invalid Host header 错误解决办法
2019/01/02 Javascript
vue计算属性get和set用法示例
2019/02/08 Javascript
Vue项目打包部署到iis服务器的配置方法
2019/10/14 Javascript
[54:27]TNC vs Serenity 2018国际邀请赛小组赛BO2 第一场 8.18
2018/08/19 DOTA
Python检测网站链接是否已存在
2016/04/07 Python
浅谈python中的实例方法、类方法和静态方法
2017/02/17 Python
Python对excel文档的操作方法详解
2018/12/10 Python
python使用Plotly绘图工具绘制气泡图
2019/04/01 Python
Python实现二叉搜索树BST的方法示例
2019/07/30 Python
python中web框架的自定义创建
2019/09/08 Python
python线程join方法原理解析
2020/02/11 Python
Python中的sys.stdout.write实现打印刷新功能
2020/02/21 Python
python实现PCA降维的示例详解
2020/02/24 Python
CSS3盒子模型详解
2013/04/24 HTML / CSS
优秀党员获奖感言
2014/02/18 职场文书
遵纪守法演讲稿
2014/05/23 职场文书
小学优秀班干部事迹材料
2014/05/25 职场文书
公司大门门卫岗位职责
2014/06/11 职场文书
物业总经理助理岗位职责
2014/06/29 职场文书
标准离婚协议书(2014版)
2014/10/05 职场文书
详解Java实现设计模式之责任链模式
2021/06/23 Java/Android