js 获取节点相对于屏幕的坐标位置,获取节点的宽高,获取鼠标事件回调的鼠标位置,计算鼠标相对于某个节点下的坐标

获取节点相对于屏幕的坐标位置:

document.getElementById('svgBoxId').getBoundingClientRect()

获取节点的宽高:

document.getElementById('svgBoxId').offsetWidth
document.getElementById('svgBoxId').offsetHeight

获取鼠标事件回调的鼠标位置:

javascript 复制代码
var mouseX = event.pageX;
  var mouseY = event.pageY;
  console.log('鼠标位置:', mouseX, mouseY);

计算鼠标相对于某个节点下的坐标:

鼠标位置 - 节点位置

注意:都是相对于屏幕的位置。

相关推荐
辣椒思密达10 分钟前
Python HTTP请求中的重试与超时控制:提升稳定性的实用方法
开发语言·python·http
橘子星18 分钟前
基于 ES6 语法的 NLP 任务模块化开发实践
前端·javascript
加号321 分钟前
【C#】 Web API 自定义配置函数请求路径:从路由本质到灵活架构设计
开发语言·c#
月光刺眼21 分钟前
JS 底层执行机制探讨:执行上下文、变量提升与调用栈
前端·javascript
KANGBboy27 分钟前
java知识四(面向对象编程)
android·java·开发语言
雪的季节32 分钟前
矢量数据提取分析(甲方平台)
开发语言
ZC跨境爬虫1 小时前
跟着 MDN 学 JavaScript day_1:什么是 JavaScript?
开发语言·前端·javascript·ecmascript
qq_2518364571 小时前
基于java Web 日化商超库存管理系统设计与实现
java·开发语言·前端
xiaofeichaichai1 小时前
Vue 响应式原理
前端·javascript·vue.js
提子拌饭1331 小时前
模态窗鸿蒙PC Electron框架实现技术详解 - 饮料含糖量应用案例分析
前端·javascript·华为·electron·前端框架·开源·鸿蒙