我可以使用Firefox的浏览器控制台做什么，而我无法使用Web控制台？

时间：2013-06-23 15:36:32

标签： firefox console

我最近知道Firefox有一个浏览器控制台（不同于Web控制台），可以将devtools.chrome.enabled设置为true。

我搜索了有关我该怎么做的信息，但我只找到了

  

浏览器控制台可让您查看所有JavaScript错误并登录   浏览器，包括Firefox代码。要启用它，请转到   about：在url栏中配置并将devtools.chrome.enabled设置为true。   使用Web Developer＆gt;菜单激活它。浏览器控制台。

（https://developer.mozilla.org/en-US/docs/Debugging_JavaScript#Browser_Console）

我发现浏览器控制台非常有用，因为我可以在沙盒GreaseMonkey脚本中看到错误。但我想它可以做很多有趣的事情，我在哪里可以找到一些信息？

1 个答案:

答案 0 :(得分：2)

This MDN page说了一切（当我问这个问题时，该页面不存在，它创建于2013年8月7日下午5:04:27）

  

浏览器控制台

     

浏览器控制台与Web Console类似，但适用于整体   浏览器而不是单个内容选项卡。

     

因此它记录了与Web控制台 - 网络相同类型的信息   请求，JavaScript，CSS以及安全错误和警告，以及   JavaScript代码显式记录的消息。但是，而不是   记录单个内容选项卡的此信息，它记录信息   适用于所有内容选项卡，附加组件以及浏览器自己的代码。

     

同样，您可以使用浏览器执行JavaScript表达式   安慰。但是，Web控制台在页面窗口中执行代码   范围，浏览器控制台在浏览器的范围内执行它们   镀铬窗。这意味着您可以与所有浏览器的选项卡进行交互   使用gBrowser全局，甚至用XUL来指定   浏览器的用户界面。

     

要打开浏览器控制台，请从Web中选择“浏览器控制台”   Firefox菜单中的开发人员子菜单（如果显示，则为“工具”菜单）   菜单栏或在Mac OS X上）：

     

enter image description here

     

您可以看到浏览器控制台的外观和行为非常类似   Web Console：

           

浏览器控制台记录

     

浏览器控制台记录与Web相同类型的消息   控制台：

           

但是，它会显示以下消息：

     
      
  • 由所有浏览器标签托管的网络内容
    •   
  • 浏览器自己的代码
    •   
  • 插件。
    •   
     

来自附加组件的消息

     

浏览器控制台显示消息   所有Firefox附加组件都记录了这些内容。

     

例如，这是一个非常简单的Add-on SDK加载项   用户单击图标时记录错误：

// base-64 encoded icon, from http://edmerritt.com/'s "Vaga" icon set
var icon = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9" +
"hAAAC90lEQVR4Xk1STUgbWxQ+mbmZNGqcJGjaGBq7UUGpYCEUXMSFLgRBdKeIG6F06aKUt6irEks" +
"R3JjWGAquSjeW8p6g3UQeCPKeJvCgRYP4QxK0TaPPGJPMZMzM3J4bM9ED35x7z/nOud+9c0yKooBh" +
"h6FQV1lRZmRZ9l8riksplQjhedVssWQQm4SQwOMXL3YNviAIwBmb/WDwVT6X+1snZMz18GFLe3s7e" +
"dLdDR2dncTl9bZQjhvD/D//zc+/gTtGjGJJkv5wtrTYHLIMaioFFL2sqgA8D3VWK9gcDjhvbLRlUq" +
"mX38LhB93Pn08BGnewuNhVyOennW63zX5xAdfJJKiXl6Di1ewTExWvZrNQwriYz4PT4yH/Hx9PHm5" +
"s3DRQ8M5CQ0OzXZKgnMmAjqfqmBBHRqC+pwcco6OgUQoaxhXMO3QdiMVCsvH462Qy2UxKkuTHO4N2" +
"clIh6UimABVA1bOYztaYB1TpvH8fThMJj1vTholcLLqsHAeqJN0Wo9dwz0wtFkFjC6MRxus9Hrj68" +
"QM0TRsgiiQRARtI2J0yQpVYzuVuGqA3VFCGchnqzGaQrq5A13Uf4fE/lzSNUJ4HDZMGObu1xXArv6" +
"rOhDy5VALzvXtMQSvHC0Imz4YJA4ysVQvE3l7oCAaZZ/EaTPhLc4UC1DU1sQZJTsAJO0+ngXM6Qef" +
"5mgKusRGY8aJYK2YqCfLSiQSIbW3sClGOx/EsZLP5M10Hs8sFOsdVyL/W1yERCkF6ba1WLGD+Fz6q" +
"xObh6VOmIML5ZmZ26x2Odz+PjtRzfBzB6wXebgeTIEBubw/AYgEz7q2PHsE5HnK6vw/uvj7gRPEvV" +
"LAKOEgVbL59u/zl2bPy2vQ03Z6bo7vBID0Ih+n3hQW6NTtLMUc/jo/TjaUlGovFtqPRaD97WFZcQ2" +
"xlZSoSCJx8RvLy0BB97/fTD4OD9NPkJP0aCNB/IxGKhX/u7Oz0Mz5rYGKfuxaPx5tR2jBiAHM+9K2" +
"IJK6jiAhi1efznRn837fI5BVWw7NCAAAAAElFTkSuQmCC";

widget = require("sdk/widget").Widget({
  id: "an-error-happened",
  label: "Error!",
  contentURL: icon,
  onClick: logError
});

function logError() {
  console.error("something went wrong!");
}
     

如果您build this as an XPI file，请打开浏览器控制台，   然后在Firefox中打开XPI文件并安装它，你会看到一个图标   在附加栏中：

     

enter image description here

     

单击图标。您将在浏览器控制台中看到这样的输出：

     

enter image description here

     

仅对于基于SDK的附加加载项，该邮件的前缀为   附加组件的名称（“log-error”），便于查找所有消息   使用"Filter output"搜索框从此加载项开始。通过   默认情况下，只有错误消息记录到控制台，但you can change this in the browser's preferences。

     

浏览器控制台命令行

     

与Web控制台一样，命令行解释程序使您可以使用   实时评估JavaScript表达式：

     

enter image description here

     

也像Web控制台的命令行解释器一样，这个命令   行支持autocomplete，history和各种keyboard shortcuts   和helper commands。如果命令的结果是对象，则可以click on the object to see its details。

     

但是，Web控制台在内容范围内执行代码   窗口附加到，浏览器控制台执行代码   浏览器的chrome窗口的范围。你可以通过确认   评估window：

     

enter image description here

     

这意味着您可以控制浏览器：打开，关闭标签页和   窗口和更改它们托管的内容，并修改   浏览器的UI通过创建，更改和删除XUL元素。

     

控制浏览器

     

命令行解释器可以访问tabbrowser对象，   通过gBrowser全局，这使您可以控制   浏览器通过命令行。尝试在浏览器中运行此代码   控制台的命令行（记住要将多行发送到   浏览器控制台，使用Shift + Enter）：

var newTabBrowser = gBrowser.getBrowserForTab(gBrowser.selectedTab);
newTabBrowser.addEventListener("load", function() {
  newTabBrowser.contentDocument.body.innerHTML = "<h1>this page has been eaten</h1>";
}, true);
newTabBrowser.contentDocument.location.href = "https://mozilla.org/";
     

它为当前所选标签的load事件添加了一个监听器   将吃新页面，然后加载新页面。

     

修改浏览器UI

     

由于全局window对象是浏览器的chrome窗口，您可以   还修改了浏览器的用户界面。在Windows上，以下内容   代码会在浏览器的主菜单中添加一个新项目：

var parent = window.document.getElementById("appmenuPrimaryPane");
var makeTheTea = gBrowser.ownerDocument.defaultView.document.createElementNS("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul", "menuitem");
makeTheTea.setAttribute("label", "A nice cup of tea?");
parent.appendChild(makeTheTea);
     

enter image description here

     

在OS X上，这个类似的代码会在“工具”菜单中添加一个新项目：

var parent = window.document.getElementById("menu_ToolsPopup");
var makeTheTea = gBrowser.ownerDocument.defaultView.document.createElementNS("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul", "menuitem");
makeTheTea.setAttribute("label", "A nice cup of tea?");
parent.appendChild(makeTheTea);
     

enter image description here

相关问题
最新问题