专业编程基础技术教程

网站首页 > 基础教程 正文

js点击事件的多种写法

ccvgpt 2024-11-19 02:08:53 基础教程 6 ℃

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

js添加点击事件的代码

<!--html代码-->
<button id="mochu">我是按钮</button>
<script>
 var btn = document.getElementById('mochu');
 btn.onclick = function(){
 alert('飞鸟慕鱼博客');
 };
</script>

addEventListener() 方法添加点击事件

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

js点击事件的多种写法

语法:

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>

Tags:

最近发表
标签列表