Question

我开始学习谷歌浏览器中的扩展，但我有点迷失，我需要做一些非常简单的事情，但不知道从哪里开始。

我最大的问题是manifest.json是如何工作的，在几个地方阅读但是不能很好地理解。之后，我需要做的是，只要用户将鼠标悬停在链接上，或者单击按钮，文本区域和输入，就会在控制台事件上返回警告消息。

我做了一些测试，比如console.log有效，但都没有用，不知道怎么做：（

我尝试做类似这样的事情：每次用户打开浏览器，启用扩展程序并打印到控制台时它就会启动它。

我想我会非常感谢你，希望得到答案。

Answer 1

简单来说，manifest.json是存储扩展程序设置的文件。 Chrome扩展程序中有3种角色。

Options page：单击Chrome窗口右角的扩展名时显示为弹出窗口的页面。
Background Scripts：后台页面/后台脚本充当Chrome扩展程序的服务器，具有Chrome提供的所有权限。您可以提及背景页面或后台脚本，但应使用其中任何一个。下面我将提到这两个用例。例如，Chrome扩展程序具有clipboardEvents，并且仅适用于后台脚本。但剪贴板API需要DOM支持。要复制或粘贴剪贴板API工作，我们必须创建textarea，然后专注于它，使用execCommand('paste')执行粘贴事件，然后获取textarea值，它给出剪贴板内容。如果您知道不需要任何与DOM相关的操作，则仅依赖于后台脚本。后台脚本执行是异步的。背景，内容脚本和选项页面之间的通信应通过Chrome事件API完成。
Content Scripts：如果要将任何脚本或样式注入到启用了扩展程序的网页中，则可以选择内容脚本。这是权力，无论在网页中执行的任何操作是否使用内容脚本捕获它，然后将其发送到后台页面/脚本以进行进一步处理，然后将结果完全恢复为AJAX机制。

有关更多信息，我强烈建议您浏览http://developer.chrome.com/extensions/manifest.html的每个部分。

   "content_scripts": [{
      "matches": ["http://www.stackoverflow.com/*"],
      "css": ["yourPageStyles.css"], 
      "js": ["jquery.js", "myscript.js"] // 
   }]

如果您想要覆盖任何样式的stackoverflow，请将其放在yourPageStyles.css文件中，如果您要添加任何页面级别的事件，就像您说的悬停并点击链接和按钮上的事件。然后将代码放在myscript.js中。 myscript.js文件代码将在stackoverflow.com网页上下文中执行，就像普通的js文件一样。但是，如果您要附加任何扩展资源，则必须使用getUrl()。例如，在网页制作中添加您的扩展图像

 var srcUrl = chrome.extension.getURL('images/yourImage.png');
 someImage.src = srcUrl;

在此之前，您必须使它们成为Web可访问资源，以定义与Web页面共享的资源。如果您仅在内容脚本中使用，则可能不需要在Web可访问资源中提及。

希望这有帮助。

如何捕获谷歌浏览器中的事件

1 个答案: