将文本片段从外部页面获取到谷歌浏览器扩展程序

Getting Snippet Of Text From External Page Into Google Chrome Extension

本文关键字:谷歌浏览器 扩展 程序 获取 文本 片段 从外部      更新时间:2023-09-26

我正在尝试开发一个简单的谷歌浏览器扩展。 它的作用是显示页面上的下载次数(计数)并将其显示在弹出窗口中。

需要监控的页面是只有在登录后才能访问的页面。

所以我基本上需要使用 html 和 javascript 从页面中"抓取"计数数字并将其显示在弹出窗口中。 到目前为止,我已经创建了外显的准系统:

{
  "name": "Downloads Logger",
  "version": "1.0",
  "manifest_version": 2,
  "description": "Monitors Number Of Downloads",
  "browser_action": {
    "default_icon": "icon.png"
  },
  "permissions": [
    "http://exampledownloadpage.com/loggedin/"
  ]
}

接下来我该怎么做? 扩展程序是否需要背景页面? 我已经阅读了扩展程序文档并解压缩了官方的gmail扩展程序,并尝试查看其工作原理,但是它似乎利用了"提要"来获取其数据。 谁能指出我正确的方向? 提前谢谢你!

如果您只想显示browser_action中的下载次数,那么您不应该需要背景页面,但如果您想每分钟左右监控下载量,那么您需要。要获得下载计数,您可以使用XMLHttpRequest下载页面源代码,然后使用.....

var page = document.implementation.createHTMLDocument("");
page.documentElement.innerHTML = pageSource;  // assuming the source for the page you downloaded with httprequest is in pageSource

。然后你可以使用类似 querySelector 的东西来获取你输入的页面位的文本,比如.....

downloadstats = page.querySelector('.downloadstats').textContent.trim();

希望这能让你开始。

这是一个简单的(没有错误检查或其他什么)示例,可以从堆栈溢出中获取您的代表点.....

var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
    if (this.readyState == 4) {
        var page = document.implementation.createHTMLDocument("");
        page.documentElement.innerHTML = this.responseText;
        var score = page.querySelector('[title^="your reputation;"]').textContent.trim();
        alert('You have ' + score + ' rep points.');
    }
}
xmlhttp.open("GET", "http://stackoverflow.com", true);
xmlhttp.send();