Chrome 扩展活动选项卡和 console.log

Question

这是我的第一个 chrome 扩展，我只想从一件简单的事情开始：抓住 url 并在 console.log() 中显示它。问题是当我点击那个按钮时，没有任何记录。

manifest.json

{
  "manifest_version": 2,

  "name": "Copy Title and URL",
  "description": "This extension will copy the title and url of an article",
  "version": "1.0",

  "browser_action": {
   "default_icon": "icon.png",
   "default_popup": "popup.html"
  },
  "permissions": [
   "activeTab"
   ]
}

popup.html

<!doctype html>
<html>
  <head>
    <title>Copy Title & URL</title>
    <script src="popup.js"></script>
  </head>
  <body>
    <button id="copyUrl">Copy Title + URL</button>
  </body>
</html>

popup.js

document.addEventListener('DOMContentLoaded', function() {
  var copyURLButton = document.getElementById('copyUrl');
  copyURLButton.addEventListener('click', function() {
    chrome.tabs.getSelected(null, function(tab) {
      console.log(tab.url);
    });
  }, false);
}, false);

知道我做错了什么吗？

谢谢。

Answer 1

可能您正在查看的控制台有误，因为您的代码看起来不错（除了使用已弃用的 getSelected()，您应该切换到 query()）

要访问弹出窗口的控制台，您需要右键单击扩展程序的按钮，然后 select "Inspect popup"。

Answer 2

太棒了，我好像看错控制台了。我将代码更改为下面的查询。

document.addEventListener('DOMContentLoaded', function() {
  var copyURLButton = document.getElementById('copyUrl');
  copyURLButton.addEventListener('click', function() {
    chrome.tabs.query({ currentWindow: true, active: true }, function (tabs) {
      console.log(tabs[0].url);
    });
  }, false);
}, false);

Chrome 扩展活动选项卡和 console.log

Chrome extension active tab and console.log

javascript

google-chrome

google-chrome-extension