一、JS事件
1、onmouseenter 鼠标进入事件
2、onmouseleave鼠标离开事件(平面上的离开)
3、onmouseout鼠标离开事件(既包含平面上也包含了垂直方向上的离开)
4、onclick鼠标单击事件
二、JS事件绑定
1、简单的事件绑定
在行内元素中直接书写事件,通过函数调用来执行
function btnData()
{
alert(点击了);
}
<button οnclick="btnData()">按钮</button>
(当点击按钮后 页面会弹出"点击了“提示框)
2、事件的动态绑定
先获取元素,再进行事件的添加
<button id="btn">按钮</button>
var btninfo=document.getElementById("btn")
btninfo.οnclick=function()
{
alert("点击了");
}
3、特殊方式 即事件的监听
先获取元素,再进行动态监听事件 addEventListener(去掉on的事件类型,事件回调函数)
<button id="btn">按钮</button>
var btnlist=document.getElementById("btn")
btnlist.addEventListener("click",name);
function name()
{
alert("点击了");
}
三、简易计算器代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>计算器</title>
<style>
table{
border-collapse: collapse;
width: 400px;
margin: 0 auto;
border: 1px solid black;
}
.tdlist{
width: 100px;
height: 50px;
}
.tdlist input{
width: