Javascript 在网页上显示内容，而不是在Chrome扩展中弹出

我正在尝试创建一个chrome扩展，我正在创建一个小部件，它将在5秒后加载到任何想要的网页上。事情进展顺利。但它出现在弹出窗口中。我不想在弹出窗口的一侧显示小部件。我想在页面底部显示它。 Mainifest.json文件如下：

{
   "manifest_version": 2,

   "name": "In Offer Plugin",
   "description": "This extension will show the discount offer",
   "version": "1.0",

   "browser_action": {
      "default_icon": "tag.png"
   },
   "content_scripts": [
      {
         "matches": ["http://*/*"],
         "js": ["jquery.js", "popup.js"],
         "css": ["popup.css"]
   }
   ],
   "permissions": [
      "activeTab",
      "clipboardWrite"
   ]
}

JS文件

var imported = document.createElement('script');
imported.src = 'jquery.js';
document.head.appendChild(imported);


chrome.browserAction.onClicked.addListener(function(tab) {

  alert('working?');
  $(`<div style="width: 100%;display: inline-flex;justify-content: space-between;z-index: 999; ">
     <div style="position: fixed;min-width: 250px;color: #616161;background: #f1f1f1;border-radius: 100px;padding: 20px 20px 10px;box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);bottom: 30px;left: 40px;z-index: 999;justify-content: space-between;" id="bookingInfo">
       Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do 
eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim 
veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit 
esse
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat 
cupidatat non
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
    </div>

 alert( "ready!" );
});

var imported=document.createElement（'script'）；
imported.src='jquery.js'；
文件.头.子项（导入）；
chrome.browserAction.onClicked.addListener（函数（选项卡）{
警惕（“工作”）；
$(`
Lorem ipsum dolor sit amet，Concetetur Adipising Elite，sed do
埃乌斯莫德
暂时性的劳动和财产损失是最小的
维尼安，
他在乌拉姆科实验室实习，并在普通实验室实习
在沃鲁帕特·维利特的《reprehenderit》中，两人或两人的关系
埃塞
圣奥凯卡岛除外
不含铜
傲慢的人，必须为自己的行为负责。
警报（“准备就绪！”）；
});

---

非常感谢您的帮助。

尝试删除

“html”：[“popup.html”]

。如果您需要外部html文件，可以将其声明为：

“web\u可访问的\u资源”：[“popup.htm”]

（但不在

内容脚本中）：

tho）@捕食者IWD嗨，什么也没发生，内容仍在弹出窗口中呈现…这是一个非常小的问题，你能从弹出窗口添加任何与此相关的代码吗？或者整个

popup.js

。我已经做了一个黑客。我正在将内容添加到主体上。现在工作正常。但问题是我想在单击I后显示小部件con，它不起作用。我更新了代码。在js文件中，它只显示警报，不显示任何内容，甚至不显示console.log onClick of icon。我建议您阅读（可能与概述中链接的页面一起阅读）。具有总体架构信息，这将有助于您了解事物的总体组织/完成方式。您还应该阅读。尝试删除

“html”：[“popup.html”]

。如果您需要外部html文件，可以将其声明为：

“web\u可访问的\u资源”：[“popup.htm”]

（但不在

“内容脚本”：

tho）@捕食者IWD嗨，什么也没发生，内容仍在弹出窗口中呈现…这是一个非常小的问题，你能从弹出窗口添加任何与此相关的代码吗？或者整个

popup.js

。我已经做了一个黑客。我正在将内容添加到主体上。现在工作正常。但问题是我想在单击I后显示小部件con，它不起作用。我更新了代码。在js文件中，它只显示警报，不显示任何内容，甚至不显示console.log onClick of icon。我建议您阅读（可能与概述中链接的页面一起阅读）。具有总体架构信息，这将有助于您了解事物的总体组织/完成方式。您还应该阅读。