在谷歌浏览器扩展中获取网页的选定文本

Question

我正在开发 Google Chrome 扩展程序。单击弹出窗口时，我希望 popup.html 文件中的输入框包含当前网页的选定文本。

示例文本框：

<input id="searchBox" type="text" />

在网页中选择文本时，文本框应包含选定的单词。我试过，chrome.extension.getBackgroundPage().getSelection()但它不起作用。

Answer 1

由于 Chrome 的极端安全预防措施，您想要做的事情需要大量编码。

chrome.extension.getBackgroundPage().getSelection()将不起作用，因为“BackgroundPage”不是当前网页。你需要类似的东西：

chrome.tabs.executeScript(null, {code:"alert(window.getSelection().toString());"})
//alerts the selected text

然而，将该文本传输回弹出窗口是一个漫长且令人头疼的过程。如果您准备好迎接挑战，请阅读 内容脚本和扩展消息传递。

Answer 2

谷歌群组上有一个关于此的主题：如何从选择中获取 HTML 代码？

var selection = window.getSelection(); 
var range = selection.getRangeAt(0); 
if (range) { 
  var div = document.createElement('div'); 
  div.appendChild(range.cloneContents()); 
  alert(div.innerHTML); 
}

无论哪种方式，您都可以在控制台或插件中使用它。

Answer 3

这是另一个以字符串形式获取所选文本的简单解决方案，您可以使用此字符串轻松地将 div 元素子元素附加到代码中：

              var text = '';
              if(window.getSelection){
                text = window.getSelection();
              }else if(document.getSelection){
                text = document.getSelection();
              }else if(document.selection){
                text = document.selection.createRange().text;
              }
              text=text.toString();