js点击事件onclick用法（点击事件介绍）[js教程]

javascript 中的点击事件用法，可以通过多种不同的添加方式来实现。下面介绍3种 javascript 中添加点击事件的示例代码，个人可以根据自己的项目需要选择不同的实现方式。

JS教程

1、js添加点击事件的代码

<button id="mochu">我是按钮</button>
<script>
 var btn = document.getElementById('mochu');
 btn.onclick = function(){
 alert('老汤博客');
 };
</script>

2、addEventListener() 方法添加点击事件

 html DOM 中的 addEventListener() 方法可以向指定元素添加事件的句柄。它常用的为两个参数，一个为事件名称，另一个为事件触发的函数。

语法：

element.addEventListener(event, function)

爱学社区JS教程

JS

示例代码：

 var btn = document.getElementById('mochu');
 btn.addEventListener('click', function () { 
 alert('https://tangjiusheng.com') 
 }, 
 false);

3、DIV元素中直接加入点击事件

 可以直接在DIV元素中添加 onclick 事件以及要执行的函数。

此种方法与第一种方法类似，只是代码的书写方式不同而已。

<button onclick="a()">点击我</button>
<script>
 function a(){
 alert('我是弹出的内容');
 }
</script>