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 相关文章推荐
收藏Javascript中常用的55个经典技巧
Aug 12 Javascript
基于Jquery的跨域传输数据(JSONP)
Mar 10 Javascript
Javacript实现颜色梯度变化和渐变的效果代码
May 31 Javascript
jQuery.position()方法获取不到值的安全替换方法
Mar 13 Javascript
js代码实现随机颜色的小方块
Jul 30 Javascript
JavaScript对象参数的引用传递
Jan 14 Javascript
终于实现了!精彩的jquery弹幕效果
Jul 18 Javascript
动态JavaScript所造成一些你不知道的危害
Sep 25 Javascript
详解Angular 4.x 动态创建组件
Apr 25 Javascript
jQuery复合事件结合toggle()方法的用法示例
Jun 10 jQuery
详解Vue CLI 3.0脚手架如何mock数据
Nov 23 Javascript
详解用Webpack与Babel配置ES6开发环境
Mar 12 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 分库分表hash算法
2009/11/12 PHP
浅谈web上存漏洞及原理分析、防范方法(安全文件上存方法)
2013/06/29 PHP
PHP中unset,array_splice删除数组中元素的区别
2014/07/28 PHP
PHP获得数组交集与差集的方法
2015/06/10 PHP
基于PHP微信红包的算法探讨
2016/07/21 PHP
浅谈PHP中的面向对象OOP中的魔术方法
2017/06/12 PHP
PhpStorm 2020.3:新增开箱即用的PHP 8属性(推荐)
2020/10/30 PHP
再谈ie和firefox下的document.all属性
2009/10/21 Javascript
javascript delete 使用示例代码
2010/03/29 Javascript
解析window.open的使用方法总结
2013/06/19 Javascript
js 操作select与option(示例讲解)
2013/12/20 Javascript
AngularJS 路由详解和简单实例
2016/07/28 Javascript
JavaScript 冒泡排序和选择排序的实现代码
2016/09/03 Javascript
laydate.js日期时间选择插件
2017/01/04 Javascript
如何在Node和浏览器控制台中打印彩色文字
2020/01/09 Javascript
微信jssdk踩坑之签名错误invalid signature
2020/05/19 Javascript
[01:09:24]Ti4开幕式
2014/07/19 DOTA
[59:42]Secret vs Alliacne 2019国际邀请赛小组赛 BO2 第一场 8.15
2019/08/17 DOTA
pycharm中连接mysql数据库的步骤详解
2017/05/02 Python
Python开发SQLite3数据库相关操作详解【连接,查询,插入,更新,删除,关闭等】
2017/07/27 Python
python微信跳一跳系列之色块轮廓定位棋盘
2018/02/26 Python
numpy向空的二维数组中添加元素的方法
2018/11/01 Python
详解Python传入参数的几种方法
2019/05/16 Python
pytorch torch.expand和torch.repeat的区别详解
2019/11/05 Python
自定义Django_rest_framework_jwt登陆错误返回的解决
2020/10/18 Python
canvas之万花筒效果的简单实现(推荐)
2016/08/16 HTML / CSS
加拿大便宜的隐形眼镜商店:Clearly
2016/09/15 全球购物
大型会议接待方案
2014/03/01 职场文书
工商管理本科生求职信
2014/07/13 职场文书
乡镇群众路线教育实践活动整改措施
2014/10/04 职场文书
2014教师年度工作总结
2014/11/10 职场文书
毕业生爱心捐书倡议书
2015/04/27 职场文书
出纳试用期工作总结2015
2015/05/28 职场文书
2015年高三年级组工作总结
2015/07/21 职场文书
2015年教师个人业务工作总结
2015/10/23 职场文书
Docker安装MySql8并远程访问的实现
2022/07/07 Servers