使用Chrome内容脚本添加图片

时间:2017-10-09 19:26:18

标签: javascript google-chrome-extension

我正在使用Chrome扩展程序的内容脚本,该脚本会在屏幕底部显示一张图片。现在,我的代码创建了一个div,但是当我运行扩展时div不会出现。

chrome.runtime.onMessage.addListener(
function(request,sender,sendResponse) {
  if(request.requested === "createDiv"){
    //code to create div
    console.log("hello");
    debugger;
    var div = document.createElement("div");
    div.innerText = "test123";
    div.style.position : "fixed";
    div.style.bottom : "77px";
    div.src = "test.jpg";
    document.body.appendChild(div);

    sendResponse({confirmation: "job done"});
  }
});

有谁知道为什么这段代码不起作用?

1 个答案:

答案 0 :(得分:0)

很抱歉。我刚刚在这里发帖。

function init(){
        debugger;
        chrome.tabs.query({active: true, currentWindow: true}, function(tabs) 
    {
                chrome.tabs.sendMessage(tabs[0].id,{createDiv: {width: "100px", height: "100px", innerHTML: "Hello"}}/*from stack*/ ,function(response){
                    console.log("sent message");
            });
    });
}
document.addEventListener('DOMContentLoaded',init);

这是我的popup.js。单击浏览器扩展时,此代码应显示在屏幕底部的图像。现在,没有图像出现。

如果有帮助的话,我还将我的content.js文件重新编辑为'='而不是':'。