js点击事件的多种写法
墨初 前端设计 10863阅读
javascript 中的点击事件,可以通过多种不同的添加方式来实现。下面介绍三种 javascript 中添加点击事件的示例代码,个人可以根据自己的项目需要选择不同的实现方式。
js添加点击事件的代码
<!--html代码--> <button id="mochu">我是按钮</button> <script> var btn = document.getElementById('mochu'); btn.onclick = function(){ alert('飞鸟慕鱼博客'); }; </script>
addEventListener() 方法添加点击事件
html DOM 中的 addEventListener() 方法可以向指定元素添加事件的句柄。它常用的为两个参数,一个为事件名称,另一个为事件触发的函数。
语法:
element.addEventListener(event, function)
示例代码:
<script> var btn = document.getElementById('mochu'); btn.addEventListener('click', function () { alert('http://www.feiniaomy.com') }, false); </script>
DIV元素中直接加入点击事件
可以直接在DIV元素中添加 onclick 事件以及要执行的函数。
此种方法与第一种方法类似,只是代码的书写方式不同而已。
<!--html代码--> <button onclick="a()">点击我</button> <script> function a(){ alert('我是弹出的内容'); } </script>