0

最近要做可视化的工具(埋点),第一步需要实现类似代码审查(Firefox里的查看器,chrome里的element)的效果,即通过挪动鼠标悬浮在要选择的元素上时,获取该元素的信息。

但是网上有关这方面的信息实在是太少了,希望得到一些提示!

3个回答

1

1、鼠标悬浮,即hover事件
2、获取元素信息,即常规的DOM的get操作
3、展示元素信息,即get之后DOM的创建、写入操作,例如:悬浮框(类Tooltips) or 固定的展示区

0

我想用的就是游戏的碰撞检测原理。 在浏览器之上的抽象层,我们是看不到像素和坐标的,那么如果是页面的一个元素,例如按钮, 鼠标移动上去时怎么确定是不是在这个按钮上呢? 必然在底层有坐标检测的。这个可能就设计到底层的东西了。 浏览器的window对象有方法可以显示鼠标的像素,这是怎么做到的呢?我觉得这个是突破口。查看器可能用到是另一个对象

0

现在发现使用mouseover和mousemove事件比较合适。用js遍历所有节点(或者需求的类型节点)并加上mouseover等事件。

撰写答案