了解Chrome控制台是否处于打开状态
我正在使用这个小脚本来查明Firebug是否打开：
if (window.console && window.console.firebug) { //is open }; 它运作良好。 现在我正在search半个小时，find一种方法来检测Google Chrome内置的Web开发者控制台是否打开，但是我找不到任何提示。
这个：
if (window.console && window.console.chrome) { //is open };
不起作用。
编辑：
因此，似乎无法检测到Chrome控制台是否处于打开状态。 但是有一个“ 黑客 ”的作品，有一些缺点：
- 控制台未连接时将不起作用
- 控制台在页面加载时打开时不起作用
所以，我现在要selectUnsigned的答案，但是如果有人提出了一个很好的主意，他是欢迎仍然回答，我改变选定的答案！ 谢谢！
更新
由于原来的提问者似乎已经不在了，而且这仍然是可以接受的答案，所以添加这个解决scheme的可见性。 值得一提的是安东宁·希尔德布兰德 （ Antonin Hildebrand ）对zswang的回答的评论 。 这个解决scheme利用了这样的事实，除非控制台处于打开状态，否则不会在logging的对象上调用toString() 。
var devtools = /./; devtools.toString = function() { this.opened = true; } console.log(devtools); // devtools.opened will become true if/when the console is opened
Console.profiles
更新： console.profiles已从Chrome中移除。 此解决scheme不再有效。
感谢Paul Irish指出Discover DevTools的这个解决scheme，使用profiler：
function isInspectOpen() { console.profile(); console.profileEnd(); if (console.clear) console.clear(); return console.profiles.length > 0; }
原始答案
这个其他的选项可以在页面加载之后检测到正在打开的停靠的检查器，但是不能检测到脱离的检查器，或者检查器在页面加载时已经打开。 还有一些潜在的误报。
window.onresize = function() { if ((window.outerHeight - window.innerHeight) > 100) alert('Docked inspector was opened'); }
当打印“元素”Chrome开发人员工具将获得其ID
var checkStatus; var element = document.createElement('any'); element.__defineGetter__('id', function() { checkStatus = 'on'; }); setInterval(function() { checkStatus = 'off'; console.log(element); console.clear(); }, 1000);
演示： https : //jsfiddle.net/evnrorea/embedded/result/
包： https ： //github.com/zswang/jdetects
另一个版本（来自评论）
var element = new Image(); Object.defineProperty(element, 'id', { get: function () { /* TODO */ alert('囧'); } }); console.log('%cHello', element);
打印一个常规variables：
var r = /./; r.toString = function() { document.title = 'on'; }; console.log(r);
我创build了devtools-detect ，用于检测DevTools何时打开：
console.log('is DevTools open?', window.devtools.open);
你也可以听一个事件：
window.addEventListener('devtoolschange', function (e) { console.log('is DevTools open?', e.detail.open); });
当DevTools脱离连接时，它不起作用。 但是，可以使用Chrome / Safari / Firefox DevTools和Firebug。
我find了一个方法来判断Chrome控制台是否已打开。 这仍然是一个黑客，但它的方式更准确，并将工作的天气控制台是否脱离或不。
基本上在控制台closures的情况下运行这个代码需要大约100微秒，而控制台打开的时间大约是200微秒的两倍。
console.log(1); console.clear();
（1毫秒= 1000微秒）
我在这里写了更多关于它的内容。
演示在这里 。
更新：
@zswangfind了最好的解决scheme – 查看他的答案
有一个棘手的方法来检查它的“标签”权限的扩展名：
chrome.tabs.query({url:'chrome-devtools://*/*'}, function(tabs){ if (tabs.length > 0){ //devtools is open } });
你也可以检查它是否打开你的页面：
chrome.tabs.query({ url: 'chrome-devtools://*/*', title: '*example.com/your/page*' }, function(tabs){ ... })
我写了一篇关于这个的博客文章： http : //nepjua.org/check-if-browser-console-is-open/
它可以检测是否停靠或取消停靠
function isConsoleOpen() { var startTime = new Date(); debugger; var endTime = new Date(); return endTime - startTime > 100; } $(function() { $(window).resize(function() { if(isConsoleOpen()) { alert("You're one sneaky dude, aren't you ?") } }); });
Chrome开发人员工具实际上只是WebKit的WebCore库的一部分。 所以这个问题适用于Safari，Chrome和任何其他WebCore用户。
如果存在一个解决scheme，当WebKit Web检查器打开并closures时，它将基于DOM中的差异。 不幸的是，这是一种鸡和鸡蛋的问题，因为当检查员closures时，我们不能使用检查员观察DOM。
你可以做的是写一些JavaScript来转储整个DOM树。 然后在检查员打开时运行一次，检查员closures时运行一次。 DOM中的任何差异都可能是Web检查器的一个副作用，我们可能能够使用它来testing用户是否正在检查。
这个链接对于DOM转储脚本来说是一个很好的开始，但是你会想转储整个DOMWindow对象，而不仅仅是document 。
更新：
看起来现在有办法做到这一点。 查看Chrome检查器检测器
你也可以试试这个： https ： //github.com/sindresorhus/devtools-detect
// check if it's open console.log('is DevTools open?', window.devtools.open); // check it's orientation, null if not open console.log('and DevTools orientation?', window.devtools.orientation); // get notified when it's opened/closed or orientation changes window.addEventListener('devtoolschange', function (e) { console.log('is DevTools open?', e.detail.open); console.log('and DevTools orientation?', e.detail.orientation); });
如果你的目标是堵塞开发者工具，试试这个（我发现它的一个更复杂的版本，在一个JS代码被混淆的地方，这是非常恼人的）：
setTimeout(function() {while (true) {eval("debugger");}}, 0);
如果你是在开发过程中做开发的开发人员。 看看这个Chrome扩展。 它可以帮助您检测Chrome Devtoos何时打开或closures。
Chrome扩展工具在当前页面上打开或closures时，此扩展function可帮助Javascript开发人员进行检测。 当Chrome Devtoolsclosures/打开时，扩展将在window.document元素上引发一个名为“devtoolsStatusChanged”的事件。
这是示例代码：
function addEventListener(el, eventName, handler) { if (el.addEventListener) { el.addEventListener(eventName, handler); } else { el.attachEvent('on' + eventName, function() { handler.call(el); }); } } // Add an event listener. addEventListener(document, 'devtoolsStatusChanged', function(e) { if (e.detail === 'OPENED') { // Your code when Devtools opens } else { // Your code when Devtools Closed } });
