如何在Chrome DevTools中选中维基百科悬停弹出的元素？

尝试在Chrome DevTools中检查维基百科「Olympic medal」页面表格里，悬停年份1896时弹出的弹窗元素，但弹窗始终会关闭，已尝试以下方法但无效：

• 将DevTools拆 dock 后，打开弹窗再切换到DevTools，弹窗仍关闭
• 强制设置元素状态为:hover，无效果

弹窗截图：

方法1：利用断点暂停阻止弹窗关闭 #

1. 打开Chrome DevTools（快捷键F12或右键选「检查」），切换到「Sources」面板
2. 展开右侧「Event Listener Breakpoints」→「Mouse」，勾选mouseout或mouseleave（这类事件是触发弹窗关闭的核心原因）
3. 回到页面，悬停1896触发弹窗，此时浏览器会自动暂停JS执行，弹窗不会消失，再切换到「Elements」面板就能自由检查弹窗元素

方法2：控制台强制显示弹窗 #

1. 打开DevTools的「Console」面板
2. 先右键点击年份1896选择「检查」，定位到该元素
3. 在控制台输入以下代码尝试强制显示弹窗（适配维基百科的弹窗结构）：

// 查找弹窗元素并强制显示
const popup = document.querySelector('.mwe-popups-container') || document.querySelector('.tooltip');
if (popup) {
  popup.style.visibility = 'visible';
  popup.style.opacity = '1';
}

如果没生效，也可以先按F8暂停页面执行，再悬停触发弹窗，此时页面处于暂停状态，弹窗不会关闭

方法3：移除弹窗的关闭触发事件 #

1. 在「Elements」面板定位到年份1896的链接元素
2. 查看右侧「Event Listeners」面板，找到mouseout、mouseleave这类事件，点击事件旁的「Remove」按钮移除
3. 此时再悬停触发弹窗，切换到DevTools时弹窗就不会关闭了

内容的提问来源于stack exchange，提问作者MLEN