鼠标事件对象 MouseEvent

最新推荐文章于 2024-08-27 15:35:43 发布

昵称2-20个字符

最新推荐文章于 2024-08-27 15:35:43 发布

阅读量1k

点赞数

分类专栏： javascript 文章标签：鼠标事件对象 js

本文链接：https://blog.csdn.net/weixin_39517183/article/details/106504287

版权

javascript 专栏收录该内容

59 篇文章 0 订阅

订阅专栏

在这里插入图片描述

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
		li{cursor: pointer;}
		</style>
</head>
<body>
	
	<script>
		document.addEventListener("click",function(e){
			// client 鼠标在可视区的x和y坐标
			console.log(e.clientX);
			console.log(e.clientY);
			console.log("-----------上面是 client---------------")
			// page 鼠标在页面文档的x和y坐标
			console.log(e.pageX);
			console.log(e.pageY);
			console.log("-------------上面是page--------------------")
			// screen 鼠标在电脑屏幕的x和y坐标
			console.log(e.screenX);
			console.log(e.screenY);
			console.log("------------------上面是screen------------------------")
		})
	</script>
</body>
</html>