Chromeコンテンツスクリプトを使用して画像を追加する

Question

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"}); 
    } 
}); 

誰でもこのコードが機能しない理由を知っていますか？

Answer 1

ごめんなさい。私はここに投稿するのが初めてです。

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ファイルを再編集しました。