在浏览器's开发人员工具上拦截鼠标指针变化

Intercept mouse pointer change on browser's Developer tools

本文关键字：工具 变化 鼠标指针 浏览器 开发      更新时间：2023-09-26

是否有可能在鼠标光标发生变化时使用断点或类似的东西来拦截鼠标光标?使用实际的浏览器开发工具?

例如，当我悬停一个div，持有style="cursor:pointer;"它停止在开发人员工具警告我，鼠标指针已经改变，当我悬停，它再次触发警告我，鼠标指针再次改变?

您可以将事件绑定到页面上的所有元素，并检查光标样式:

var oldCursorStyle = 'auto';
var myChangeFunction = function(cursorStyle) {
    console.info('It has changed to: ' + cursorStyle);
};
$('*').mouseenter(function(){
    var currentCursorStyle = $(this).css('cursor');
    if (oldCursorStyle != currentCursorStyle) {
       myChangeFunction(currentCursorStyle);
    }
    oldCursorStyle = currentCursorStyle;
});

读了这篇文章，我找到了第3项的解决方案。

以下步骤:

  1. 转到元素选项卡的特定HTML节点;
    2. 右键单击元素
  2. ContextMenu> Break On>属性修改
  3. 为要更改的属性定义一个值
  4. 触发更改

之后，我可以注意到这个变化是在代码中使用源选项卡上的CallStack部分进行的。

相关文章：