javascript - 如何在 chrome 扩展开发中获取选定的文本?

标签 javascript google-chrome google-chrome-extension

我正在开发一个 chrome 扩展程序,它涉及获取当前选项卡的选定文本。这是我使用的 html 文件:

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title></title>
        <script>
            chrome.tabs.executeScript( {
                code: "window.getSelection().toString();"
            }, function(selection) {
                document.getElementById("output").value = selection[0];
            });
        </script>
    </head>
    <body>
        <div id="output"></div>
    </body>
</html>

它不起作用,为什么?以下是来自 Chrome App & Extension Developer Tool 的错误信息,其中一些错误信息被省略号 chop 了,抱歉,我还没有弄清楚如何在这里查看完整的错误信息,查看详细信息 只给我堆栈轨迹,而不是完整的错误消息。

enter image description here

最佳答案

正如@Xan 所建议的,前面提到的方法(您可以找到它 here )过于复杂。要使其正常工作,只需要做两件事:

  1. document.getElementById("output").value

    中将 value 更改为 innerHTML
  2. manifest.json 文件中添加activeTab 权限

这里是完整的源码,一共三个文件。

list .json

{
    "manifest_version": 2,
    "name": "sample",
    "description": "A sample extension to get the selected text",
    "version": "1.0",
    "icons": { 
        "16": "img/icon16.png",
        "48": "img/icon48.png",
        "128": "img/icon128.png" 
    },
    "browser_action": {
        "default_popup": "popup.html"
    },
    "permissions": [
        "activeTab"
    ]
}

popup.html

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <script src="popup.js"></script>
        <title></title>
    </head>
    <body>
        <div id="output"></div>
    </body>
</html>

弹窗.js

chrome.tabs.executeScript( {
    code: "window.getSelection().toString();"
}, function(selection) {
    document.getElementById("output").innerHTML = selection[0];
});

关于javascript - 如何在 chrome 扩展开发中获取选定的文本?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34170032/

相关文章:

google-chrome - 如何强制通过电子邮件发送的链接在用户浏览器中打开,而不是在 gmail 应用内浏览器中打开

google-chrome - Chrome 扩展和 IndexDB 集成

javascript - 使用 angular-ui-router 的页面标题、描述

javascript - 使用td标签中的值字段作为html表中的隐藏字段

javascript - 使用查询参数转换到状态

javascript - 如何在 Chrome 时间轴中命名匿名函数?

css - Javascript 已禁用 - 使用不同的样式表?

Qt 的安装程序文件在 Chrome 中给出 "... is malicious, and Chrome has blocked it"消息

javascript - 在 Chrome 扩展中使用 Google API Spreadsheet JS 删除值

javascript - 全局变量 Chrome 扩展内容脚本