Chrome 扩展程序：如何从页面获取特定信息答案

【问题标题】：Chrome Extensions: How to get specific information from a pageChrome 扩展程序：如何从页面获取特定信息
【发布时间】：2014-04-02 00:05:33
【问题描述】：

我会尽量说清楚...

基本上我想制作一个浏览器操作扩展，将当前访问页面的信息显示到弹出窗口中。例如显示页面标题、URL、图片等）

我是扩展程序开发的新手，我对正在发生的事情有点困惑。

我已经完成了 chrome 教程。有人可以指出我正确的方向或请给我一个基本的例子。

谢谢

【问题讨论】：

标签： javascript google-chrome-extension

【解决方案1】：

这是你需要的：

当您单击 Chrome 上的扩展程序图标时会打开一个弹出页面。该页面应该运行一段 javascript，它向当前选定选项卡中的内容脚本发送消息，并侦听内容脚本发回的回复。类似的东西：

$(function (){
chrome.tabs.query({active: true, currentWindow: true}, function (tabs){
      chrome.tabs.sendMessage(tabs[0].id, {action: "getDetails"}, function(details){
             //use details here
      });
    });
});

一个内容脚本，直接注入主页面（您需要在其他信息中提取 url 的页面）。此内容脚本读取信息并通过 sendMessage api 将其传递到弹出页面。像这样的东西：

chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) { 
     //get details
     sendResponse(details);          
    });

这是一个 SO 线程，其中提到了如何从内容脚本与弹出页面对话：Chrome Extension how to send data from content script to popup.html

HTH！

【讨论】：