html 获取鼠标当前位置的元素
时间: 2023-11-19 15:06:56 浏览: 52
你可以通过JavaScript中的`event`对象来获取鼠标的当前位置以及其所在的元素。具体的代码如下:
```html
<!DOCTYPE html>
<html>
<head>
<title>获取鼠标当前位置的元素</title>
</head>
<body onmousemove="showCoords(event)">
<div style="width: 200px; height: 200px; background-color: #f2f2f2;"></div>
<script>
function showCoords(event) {
var x = event.clientX;
var y = event.clientY;
var element = document.elementFromPoint(x, y);
console.log("X坐标:" + x);
console.log("Y坐标:" + y);
console.log("所在元素:" + element.tagName);
}
</script>
</body>
</html>
```
在上述代码中,我们定义了一个`showCoords`函数,该函数的参数`event`表示当前的鼠标事件对象。在函数内部,我们通过`clientX`和`clientY`属性获取鼠标当前的坐标位置。然后,我们调用`document.elementFromPoint(x, y)`方法来获取位于该坐标位置的元素。最后,我们通过`console.log`方法将获取到的信息输出到控制台中。