1、onmouseover 事件
onmouseover 事件在鼠標指針進入某個元素時觸發。當鼠標指針從一個元素移動到另一個元素上時,onmouseover 事件也會被觸發。
<div onmouseover="myFunction()">鼠標懸停在我上面</div><script>
function myFunction() {
alert("你的鼠標進入了該元素");
}
</script>
在上面的例子中,當鼠標懸停在 <div> 元素上時,將觸發 myFunction() 函數,并顯示一個彈出窗口。
2、onmouseout 事件
onmouseout 事件在鼠標指針離開某個元素時觸發。當鼠標指針從一個元素移動到另一個元素上時,onmouseout 事件也會被觸發。
<div onmouseout="myFunction()">鼠標離開了我</div><script>
function myFunction() {
alert("你的鼠標離開了該元素");
}
</script>
在上面的例子中,當鼠標離開 <div> 元素時,將觸發 myFunction() 函數,并顯示一個彈出窗口。
這兩個事件常用于實現一些交互效果,例如鼠標懸停在一個元素上時改變其樣式或展示更多信息,或者在鼠標離開元素時隱藏某些內容。它們可以通過直接在 HTML 元素上使用 onmouseover 和 onmouseout 屬性,或者通過 JavaScript 代碼動態添加事件處理函數來實現。