在Google Chrome擴展程序中獲取網頁的選定文本

Question

我正在開發Google Chrome擴展程序。 單擊一個彈出窗口時，我希望popup.html文件中的輸入框包含當前網頁的選定文本。

示例文本框：

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

在網頁中選擇文本時，文本框應包含所選單詞。 我嘗試使用chrome.extension.getBackgroundPage().getSelection()但它無法正常工作。

Answer 1

谷歌小組有一個關於這個問題的主題： 如何從選擇中獲取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 2

這是另一個簡單的解決方案，以字符串的形式獲取所選文本，您可以輕松地使用此字符串將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();

Answer 3

由於Chrome的極端安全預防措施，您嘗試做的事情需要相當多的編碼。

chrome.extension.getBackgroundPage().getSelection()將不起作用，因為“BackgroundPage”不是當前網頁。 你需要這樣的東西：

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

但是，將該文本轉移回彈出窗口是一個漫長的偏頭痛過程。 如果您正在接受挑戰，請閱讀目錄和擴展消息 。