32

基本上在我的窗口上（当您单击图标时）它应该打开并显示选项卡的 URL，在它旁边我希望它说“保存”，它将保存到 localStorage，并在下面显示到保存的链接区。

像这样：

替代文字

像书签之类的东西:)

4

3 回答 3

51

如果您想做类似的事情，您可以使用 Chrome 扩展 API 轻松完成。要寻找的区域是：

现在第一步是创建您的 popup.html 文件并记住它是瞬态的，也就是说，它仅在您单击浏览器操作时才存在，然后在退出（关闭）时死亡。我想说的是，如果您有大量计算并且希望它在后台发生并且即使弹出窗口关闭也发生，请将所有内容移动到后台页面。在您的弹出窗口中，您可以使用 chrome.extension.getBackgroundPage() 轻松访问背景页面

在您的 popup.html 中，您需要获取当前选项卡的 URL，为此，Tab API 有一个“ getSelected ”函数，允许您获取所选选项卡的选项卡对象。

所以是这样的：

popup.html

<html>
<body>
<p id="currentLink">Loading ...</p>
<hr />
<ul id="savedLinks"></ul>
<script type="text/javascript" src="popup.js"></script>
</body>
</html>

popup.js

chrome.tabs.getSelected(null, function(tab) {
    document.getElementById('currentLink').innerHTML = tab.url;
});

不能在 HTML 文件中放置 JavaScript 代码的原因是 Chrome 保护其用户免受 JavaScript 攻击的限制：

不允许内联脚本和事件处理程序

现在这将允许您在当前页面的弹出窗口中显示 URL 作为浏览器操作。下一步是使用简单的 HTML5 功能，例如 localStorage 或 Webdatabase（我认为这会更好）。要将保存的页面存储到，然后您可以在 savedLinks 页面上呈现它们，就像我为 currentLink 所做的一样。

祝你好运！

于 2010-05-09T14:49:11.530 回答
14

我想更新这个答案，因为 API 已经改变。

该chrome.tabs.getSelected()方法现已弃用。获取当前选项卡的 URL 的推荐方法是使用chrome.tabs.query()：

chrome.tabs.query({'active': true}, function (tabs) {
    var url = tabs[0].url;
});

chrome.tabs这仍然需要您在扩展清单中请求访问API：

"permissions": [ ...
   "tabs"
]

您可以在此处阅读有关弃用的更多信息：chrome.tabs.getSelected()

希望这可以帮助！

于 2013-01-10T05:16:10.210 回答
10

要获取当前 url，您需要获取当前选项卡，然后提取所有参数。

获取当前选项卡使用，chrome.tabs.getSelected()。然后，要从 tab 对象中获取参数，请参考tabs api

您的代码片段应如下所示，

chrome.tabs.getSelected(null, function(tab) {
  //properties of tab object
  tabId = tab.id;
  tabUrl = tab.url;

  //rest of the save functionality.
});

您还需要在扩展的清单中声明“选项卡”权限才能使用选项卡 API。例如

{
  "name": "My extension",
  ...
  "permissions": [
    "tabs"
  ],
  ...
}
于 2010-05-09T14:34:42.763 回答