javascript控制台和右键单击浏览器并选择检查之间的区别？答案

【问题标题】：difference between javascript console and right clicking the browser and selecting inspect?javascript控制台和右键单击浏览器并选择检查之间的区别？
【发布时间】：2017-09-15 16:17:23
【问题描述】：

我目前正在开发一个 Angular 应用程序，并希望在控制台中查看我的范围。我目前通过输入angular.element($0).scope() 来实现这一点。

当我通过右键单击页面、选择检查、导航到控制台选项卡并输入上面的代码来打开控制台时，此方法有效。

但是，当我使用浏览器快捷方式打开控制台时，同一行代码不起作用。

为什么会发生这种情况，我该如何做到这一点，以便当我通过快捷方式打开浏览器时，代码行可以正常工作？

下面我提供了显示不同输出的控制台截图：http://imgur.com/a/XRBl2

我找到了一个直播网站也出现了这种现象，你可以自己试试：https://www.google.com/partners/?hl=nl#a_profile;bdgt=;idtf=3245994249;lang=;locn=;motv=0

【问题讨论】：

标签： javascript angularjs google-chrome google-chrome-devtools developer-console

【解决方案1】：

Chrome 将检查过的元素的历史存储在它创建的以$0 开头的变量中。这就是为什么它只有在您首先在元素面板中选择它时才有效。有像 Batarang 这样的 Chrome 开发工具扩展，它会在元素检查器中添加一个面板，显示所选元素的范围，这可能会对您有所帮助。或者，您可以使用 angular.element(<SOME_SELECTOR_HERE>).scope() 定位元素以获取控制台中的范围，而不是依赖检查历史记录。

【讨论】：

【解决方案2】：

chrome 控制台中的$0 表示most recent inspected element，如果您只是打开 chrome 控制台，您还没有检查任何内容。检查：https://willd.me/posts/0-in-chrome-dev-tools

【讨论】：