Chrome扩展程序获取所选文字

时间:2013-10-03 16:32:15

标签: javascript html google-chrome google-chrome-extension

我正在寻找一种方法将所选文字添加到我的Chrome扩展程序中。

我想要前。在Facebook Feed中选择一个文本,当我点击我的图标时,它将获取它并在我的扩展程序中显示所选文本。

到目前为止我得到了这个:

chrome.tabs.executeScript(null, {
  code: "alert(window.getSelection().toString());"
})

它会获取所选文本并通过Chrome中的消息提醒它。但是我想在我的html弹出窗口中显示它。我想这样写出来:

document.getElementById("output").value = "Selected text here(but how)"

需要帮助!而且我知道还有其他问题,但他们没有给我我想要的东西..

3 个答案:

答案 0 :(得分:35)

您可以使用回调函数中执行代码评估的最后一个表达式:

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

答案 1 :(得分:2)

您可以使用Extensions Messaging执行此操作。基本上,您的“后台页面”会将请求发送给您的服务。例如,假设您有一个“弹出窗口”,一旦您点击它,它就会进行“Google搜索”,这是您的服务。

chrome.extension.onRequest.addListener(function(request, sender, sendResponse) {
    if (request.method == "getSelection")
      sendResponse({data: window.getSelection().toString()});
    else
      sendResponse({}); // snub them.
});

一些参考资料

  1. Creating a chrome extension which takes highlighted text on the page and inserts it into a textarea in popup.html
  2. 或者您可以使用此插件

    1. https://chrome.google.com/webstore/detail/view-selection-source/fbhgckgfljgjkkfngcoeajbgndkeoaaj

答案 2 :(得分:0)

对于Angular 8.2,我使用以下代码:

chrome.tabs.executeScript( { code: 'window.getSelection().toString();'}, selectedText => {
 (document.getElementById('text-input') as HTMLInputElement).value = selectedText[0];
  console.log(selectedText[0]);
});