在Chrome扩展上下文菜单中获取选择DOM [英] Get Selection DOM in chrome extension contextmenu

问题描述

我尝试通过Chrome扩展中的 ContextMenu 来选择DOM。

代码：

  chrome.contextMenus.onClicked.addListener（function（info，tab）{
 // info.selectionText只是文本，不包含html。
}）; 
 
 chrome.contextMenus.create（{
 title：Demo，
 contexts：[selection]，
 id：demo
 }）; 
  

但info.selectionText不包含HTML DOM。有什么方法可以在Chrome扩展上下文菜单中获得选择吗？请建议。感谢。

解决方案

要访问选择，您需要注入一个内容脚本。

（）获取 选择对象，并在其中使用范围来提取您需要的DOM。

  //activeTab权限就足够了：
 chrome.contextMenus.onClicked.addListener（function（info，tab）{
 chrome.tabs.executeScript（tab.id，{file：getDOM .js}）
}）; 
  

getDOM.js：

  var selection = document.getSelection（）; 
 //提取你需要的信息
 //如果需要的话，用消息
  

将它返回到主脚本

您可能需要查看消息文档。

I try to get the DOM I select by ContextMenu in Chrome Extension.

Code:

chrome.contextMenus.onClicked.addListener(function(info, tab){
  // the info.selectionText just the text, don not contains html.
});

chrome.contextMenus.create({
  title: "Demo",
  contexts: ["selection"],
  id: "demo"
});

but the info.selectionText don't contains the HTML DOM. Is there any way to get the selection dom in Chrome extension contextMenu?. Please suggest. thanks.

解决方案

To access the selection, you will need to inject a content script into the page.

There, you can call getSelection() to get a Selection object and play with ranges in it to extract the DOM you need.

// "activeTab" permission is sufficient for this:
chrome.contextMenus.onClicked.addListener(function(info, tab){
  chrome.tabs.executeScript(tab.id, {file: "getDOM.js"})
});

getDOM.js:

var selection = document.getSelection();
// extract the information you need
// if needed, return it to the main script with messaging

You may want to take a look at Messaging docs.

这篇关于在Chrome扩展上下文菜单中获取选择DOM的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！