Chrome 扩展：如何使用 contextMenus 修改确定页面的 DOM？答案

【问题标题】：Chrome extension: how do I do modify DOM of a determinate page with contextMenus?Chrome 扩展：如何使用 contextMenus 修改确定页面的 DOM？
【发布时间】：2012-03-14 20:30:20
【问题描述】：

作为标题，如何将修改应用到另一个页面，不同于背景？

清单：

{
    "name": "First Extension",
    "version": "1.0",
    "description": "The first extensione tha I made",
    "permissions":["contextMenus", "tabs", "http://localhost/CreativaIly/*"],
    "background_page": "background_page.html",
    "browser_action":{ 
                        "name": "My First Extension!",
                        "default_icon": "Chrome_icon32bn.png",
                        /*"default_popup": "popup.html",*/
                        "default_title": "My First Extension!"
    },
    "icons": {
                "16": "Chrome_icon19color.png",
                "48": "Chrome_icon32color.png",
                "128": "Chrome_icon.png"
    }
}

背景页面：

<!doctype html>
<html>
  <head>
    <title>Background Page</title>
    <script type="text/javascript" src="mootools-core-1.4.2-full-compat.js"></script>
    <script src="script.js" type="text/javascript" ></script>
  </head>
  <body>
  </body>
</html>

【问题讨论】：

标签： dom google-chrome-extension contextmenu

【解决方案1】：

我强烈推荐阅读content scripts 和message passing，因为解决方案涉及到这两种技术的结合。

我可以使用这些技术为您提供一个快速的解决方案，但您稍后可能会陷入陷阱，因为您没有研究这些页面。不过，我会给你一个基本的示例流程；

设置清单以在触发 chrome.extension.onRequest 时将内容脚本注入到所有页面中，以您想要的方式操作 DOM
创建您的context menu 并监听点击事件
当onclick 被触发时，捕获tab.id 并使用它来调用chrome.tabs.sendRequest

它比最初看起来要简单得多。

【讨论】：

好的，我认为没有请求需要 Ajax，所以我仍然没有阅读指南的这一部分。谢谢，我将对其进行研究。