保存chrome扩展弹出窗口内的当前选项卡链接

时间:2016-12-22 09:50:33

标签: javascript html google-chrome-extension popup popupwindow

我正在尝试创建一个chrome扩展,当单击时,会打开一个弹出窗口,该窗口内部是一个按钮。单击该按钮时,弹出窗口应更新为当前选项卡的链接。

See this picture, this is my window popup

然而,当我点击按钮时,没有任何作品...... 以下是我到目前为止的情况:

的manifest.json:

{

  "manifest_version": 2,

  "name": "Save",

  "description": "Save tab link.",

  "version": "0.1",

  "browser_action": {

    "default_icon": "/img/icon.png",
    "default_popup": "popup.html",
    "default_title": "See your saved websites!"
      },

     "permissions":  [
       "tabs"
       ]
}

popup.html:

<html>
  <head>
    <title>Your articles</title>
    <link href="/css/style.css" rel="stylesheet"/>
    <script src="popup.js"></script>
  </head>
  <body>
    <div id="div">No content yet! Click the button to add the link of the current website!</div>
    <br/>
    <button id="button">Add link!</button>
  </body>
</html>

最后,popup.js:

// event listener for the button inside popup window
document.addEventListener('DOMContentLoaded', function() {
    var button = document.getElementById('button');
    button.addEventListener('click', function() {
        addURL();
    });
});

// add the URL inside the popup-window's <div> 
function addURL() {
// store info in the the queryInfo object as per: https://developer.chrome.com/extensions/tabs#method-query
    var queryInfo = {
    currentWindow: true,
    active: true
    };
    
    chrome.tabs.query(queryInfo, function(tabs) {
    // tabs is an array so fetch the first (and only) object-elemnt in tab
    // put URL propery of tab in another variable as per: https://developer.chrome.com/extensions/tabs#type-Tab
    var url = tabs[0].url;
    
    // put the content into the popup-window's <div>
    document.getElementById("div").innerHTML(url);
    });
}

我希望有人可以帮助我:)

1 个答案:

答案 0 :(得分:0)

替换

document.getElementById("div").innerHTML(url);

document.getElementById("div").innerHTML = url;