更改标签
问题描述：
变化的文本标签的文本为“手”指针变成手时，悬停在包装盒上，然后将文本更改回“箭头” ......这里是我的代码更改标签
<html>
<style>
#box:hover {
background-color: red;
}
#box {
width: 300px;
height: 300px;
border: 1px solid;
background-color: black;
}
</style>
<body>
<div id="box" onmouseover="myFunction()"></div>
<label id="lab">arrow</label>
</body>
<script>
function myFunction() {
document.getElementById("lab").innerHTML = "hand";
document.getElementById("box").style.cursor = "pointer"
}
</script>
</html>
答
您可以添加onmouseout来触发鼠标移开功能。
#box:hover {
background-color: red;
}
#box {
width: 300px;
height: 300px;
border: 1px solid;
background-color: black;
}<div id="box" onmouseover="myFunction(true)" onmouseout="myFunction(false)"></div>
<label id="lab">arrow</label>
<script>
function myFunction(over) {
if (over) {
document.getElementById("lab").innerHTML = "hand";
document.getElementById("box").style.cursor = "pointer"
} else {
document.getElementById("lab").innerHTML = "arrow";
}
}
</script>