Question

我在哪里可以找到chrome扩展的示例代码，它在弹出窗口中显示当前地址？

感谢。罗恩

Answer 1

文档：http://code.google.com/chrome/extensions/getstarted.html
样本：http://code.google.com/chrome/extensions/samples.html

这是Google Chrome扩展程序的官方文档和示例代码。在您的manifest中，您要为页面或浏览器操作声明一个弹出窗口（以您的扩展程序为准。）在弹出的HTML文件中，您可能需要以下内容;

<!DOCTYPE HTML>
<html>
    <head>
        <script type="text/javascript">
            function initPopup() {
                chrome.tabs.getSelected(null, function (tab) {
                    document.body.appendChild(document.createTextNode(tab.url));
                });
            }
        </script>
    </head>
    <body onload="initPopup();"></body>
</html>

这非常简单地将所选标签的URL附加到弹出窗口的主体。

您的清单应如下所示;

{
    "name": "My First Extension",
    "version": "1.0",
    "description": "The first extension that I made.",
    "browser_action": {
        "default_icon": "icon.png",
        "default_popup": "popup.html"
    },
    "permissions": [
        "tabs"
    ]
}

此示例的文件结构是包含manifest.json，popup.html和icon.png的单个文件夹。

在“扩展程序”页面（chrome：// extensions）上，您应该点击加载解压扩展程序... 并导航到此文件夹。如果您对清单进行任何更改，请务必点击重新加载链接以获取这些更改。

我希望这会有所帮助，但我强烈建议您阅读我上面提到的文档，以便更好地了解您正在做的事情。

编辑：为代码添加了缺少的null参数，并根据从评论中收集的其他信息添加了示例清单和文件结构。

Answer 2

在弹出窗口中尝试使用此代码，它适用于我（Google Chrome 14-beta）：

chrome.windows.getCurrent(function(window) {
    chrome.tabs.getSelected(window.id, function(tab) {
        console.log(tab);
        console.log(tab.url); // url of the current tab
    });
});

有关详情，请查看：http://code.google.com/chrome/extensions/tabs.html#method-getSelected

Answer 3

看起来所有这些答案都已过时，所以这里是一个明显的例子。这个例子你需要jQuery。我已将所有文件都包含在gist。

中

的manifest.json

{
  "manifest_version": 2,

  "name": "Hello World",
  "version": "1.0",

  "author": "Christian Juth",

  "browser_action": {
    "default_icon": "icon.png",
    "default_popup": "popup.html"
  },

  "permissions": [
    "activeTab"
  ]
}

popup.html

<!doctype html>
<html>
  <head>
    <title>Hello World</title>
    <script src="jquery.js"></script>
    <script src="popup.js"></script>
  </head>
  <body>

    <span id="address"></span>

  </body>
</html>

popup.js

$(document).ready(function(){

  //define query
  var query = { active: true, currentWindow: true };

  //query tabs
  chrome.tabs.query(query, function (tabs) {
    currentAddress = tabs[0].url;
    $('#address').text(currentAddress);
  });

});

Chrome扩展程序 - 起点

3 个答案: