Chrome右键菜单扩展问题：无法将选中文本存入JavaScript变量

嘿，我来帮你搞定这个小问题！你现在遇到的核心问题是错误地在背景脚本里尝试获取当前页面的选中内容，还犯了一个大小写的小错误，咱们一步步来修正：

问题分析 #

1. 你写的Document.getSelection()里的Document是大写的，正确写法应该是小写的document——不过这还不是最关键的。
2. 更重要的是：Chrome扩展的背景脚本是一个独立的后台页面，它无法直接访问用户当前浏览的网页DOM，所以你调用document.getSelection()拿到的是背景页自身的选中内容（而背景页根本没有用户选中的文本），自然拿不到想要的值。

正确的解决方案 #

其实Chrome已经帮你把选中的文本打包好啦！在contextMenus.onClicked的回调参数clickData里，自带了selectionText属性，只要你的菜单contexts包含selection，这个属性就会自动填充用户选中的文本，直接用它就行！

修正后的完整代码 #

var search = { 
  "id": "searchurl", 
  "title": "Search on dictionary", 
  "contexts": ["selection"] 
}; 
chrome.contextMenus.create(search); 

chrome.contextMenus.onClicked.addListener(function(clickData) { 
  "use strict"; 
  if (clickData.menuItemId === "searchurl" && clickData.selectionText) { 
    // 直接用clickData里的selectionText，这才是用户选中的内容
    var urlkey = clickData.selectionText; 
    alert(urlkey); 
    // 如果你要跳转到词典搜索，可以加这行（替换成你的词典地址）
    // chrome.tabs.create({url: `https://your-dictionary-url.com/search?q=${encodeURIComponent(urlkey)}`});
  } 
}); 

额外注意事项 #

别忘了在你的manifest.json里声明必要的权限，否则扩展会报错：

{
  // 其他配置...
  "permissions": ["contextMenus", "tabs"] // tabs权限是如果要打开新标签页搜索才需要
}

这样修改后，你就能成功获取到用户选中的文本啦！

内容的提问来源于stack exchange，提问作者hdd