1、js事件绑定
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>事件绑定的三种方式</title>
</head>
<body>
<input type="button" value="js绑定事件" id="btn1">
</body>
</html>
<script>
// js绑定事件
// dom节点.on事件名 = 执行函数
var btn1 = document.getElementById('btn1');
btn1.onclick = function(){
alert('js事件绑定');
}
</script>
2、行内事件绑定
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>事件绑定的三种方式</title>
</head>
<body>
<!-- 在行内添加需要绑定的事件 on事件="触发事件执行的程序" -->
<input type="button" value="标签行内绑定时间" onclick='func1()'>
</body>
</html>
// js函数部分
<script>
// 行内事件绑定
function func1(){
alert('行内事件绑定');
}
</script>
3、添加事件监听
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>事件绑定的三种方式</title>
</head>
<body>
<input type="button" value="添加事件监听">
</body>
</html>
<script>
// 添加事件监听
// addEventListener('事件名', '函数名', true/false)
// 事件名必填，其余两项可不填
var btn3 = document.getElementById('btn3');
btn3.addEventListener('click');
</script>
2万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
