如何检测Chrome的“检查元素”是否正在运行？

Question

25

有没有办法检测Chrome的元素检查窗口是否正在运行？

例如，如果用户在Chrome中点击“检查元素”，则会显示一个“Hello World”警告窗口。

这是否有可能实现？

- Mohammed Shannaq

嗯，你肯定可以监视“右键单击”，尽管我怀疑你无法看到他们选择了哪个选项。因此，你可以更改右键单击操作的行为，然后可能显示你的框？ - Abe Petrillo

是的，Abe，我知道我可以更改右键单击。但实际上，我想监视检查元素是否正在运行并执行任何操作。例如运行JavaScript函数。 - Mohammed Shannaq

请查看如何判断Chrome控制台是否打开以获取可行的解决方案。 - Sindre Sorhus

2个回答

13

window.onresize = function(){
 if((window.outerHeight-window.innerHeight)>100)
   alert('hello');
}

请注意，调整大小事件似乎会触发两次，因此您应该检查您是否已经提示用户。

- Gerben

1

这只在窗口停靠时有效，是吗？ - pimvdb

6

是的，只有在对接时才能检测到。我不知道你如何检测未对接的检查员。 - Gerben

3

但是每当窗口大小改变时，这个也会触发...而这比打开检查器的频率要高得多。 - sachleen

2

我怀疑这也会被一些带有多个工具栏或其他修改浏览器用户界面的扩展程序所触发。例如，Chrome的书签工具栏会计入此计算。 - David Smith

当窗口“恢复”时，它会触发。 - unloco

显示剩余4条评论

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Dmitry Pashkevich · Accepted Answer

更新：此方法不再适用。Chrome 29版本中已移除console.profiles属性。

目前唯一的解决方案是检查window.outerHeight和window.innerHeight之间的差异，如@Gerben所建议的。有一个基于这种方法的库devtools-detect，它将devtoolschange添加到window对象中。

或者，正在进行一项工作，即使用更强大的检测方法创建Chrome扩展程序，请参见此Google Group。

以下是他们在发现DevTools交互式课程的第一个挑战中检查DevTools是否打开的方法：

function () {
    console.profile(); 
    console.profileEnd(); 
    if(console.clear) { console.clear() };
    return console.profiles.length > 0;
}