javascript - 在 HTML 页面上的所有其他内容之上插入 div

Question

我目前有这个 JS，它是使用 Chrome 扩展程序注入(inject)到外国页面中的。以下代码添加一个 div 元素作为 body 元素的第一个子元素:

const div = document.createElement('div');
div.id = 'suman-per-tab-controls';
div.innerHTML = '<b>foooooo</b>';
document.body.insertBefore(div, document.body.firstChild);

我也试过:

document.body.prepend(div);

请记住以下屏幕截图:

如果您查看 Quora 网站的屏幕截图，您会注意到我创建的 div 隐藏在它们的标题后面。

我假设让我的 div 高于 Quora 的唯一方法是 CSS？有谁知道一些方便的 CSS 几乎总是(如果不是总是)将 div 放在页面上任何现有内容之上吗？

Answer 1

请尝试遵循您的 css 文件中的代码，

   .suman-per-tab-controls {
        position: absolute;
        z-index:9999;
    }

或

   .suman-per-tab-controls {
       position: fixed;
       z-index:9999;
   }

或

   .suman-per-tab-controls {
       position: relative;
       z-index:9999;
   }