小编这次要给大家分享的是如何使用JavaScript鼠标悬停事件,文章内容丰富,感兴趣的小伙伴可以来了解一下,希望大家阅读完这篇文章之后能够有所收获。

鼠标悬停事件是当鼠标的光标与其名称表示的元素重叠时触发的事件,本篇文章我们就来详细介绍一下JavaScript中鼠标悬停事件的用法。
我们先来看一下什么是onmouseover?
鼠标悬停的活动是“事件”,而onmouseover是事件处理程序。
事件处理程序是指定事件发生时要执行的进程所必需的。
所以onmouseover是一个事件处理程序,负责当鼠标的光标悬停在某个元素上时完成的处理。
什么是onmouseleave?
除了onmouseover之外,还有onmouseleave。
顾名思义,它处理当鼠标光标离开某个元素时触发的事件。
在下面的示例中将使用这两个属性,我们来看鼠标悬停事件的使用代码
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">
</head>
<body>
<div id="div1" onmouseover="over(this)" onmouseleave="leave(this)"></div>
</body>
<script>
function over(x) {
x.style.backgroundColor = "blue";
}
function leave(x) {
x.style.backgroundColor = "red";
}
</script>
</html>