是否可以创建显示重叠div的chrome扩展，而无需将其添加到DOM中？

Question

我正在尝试创建一个简单的chrome扩展，目前我正在将我的脚本和样式表注入DOM，以在浏览器窗口中显示重叠div。但是，当我更改标签或地址时，div才会出现，直到文档准备就绪。

那么有没有办法在所有标签上显示叠加div而不将其添加到DOM？

我的清单文件：

{
  "name": "My extension",
  "description": "test",
  "version": "0.0.1",
  "manifest_version": 2,
  "icons": {
    "16":  "icons/icon16.png",
    "48":  "icons/icon48.png",
    "128": "icons/icon128.png"
  },
  "content_scripts": [
    {
      "matches": ["<all_urls>"],
      "css": [
        "css/content.css",
      ],
      "js": [
        "libs/jquery-3.2.1.min.js",
        "js/content.js"
      ]
    }
  ],
  "browser_action": {
    "default_popup": "popup.html",
    "default_title": "My extension"
  },
  "permissions": [,
    "https://www.example.com/*", // I will update the div content from this URL
    "storage"
  ],
  "web_accessible_resources": [
    "fonts/*.*"
  ]
}

我从我的content.js中添加它：

$('body').prepend(div);