css - Chrome 扩展 - 某些页面上的 CSS 乱七八糟

Question

我正在编写一个 Chrome 扩展，它在现有页面的顶部插入一个 DIV。我为我的 DIV 指定了不同的 ID 名称“juxiSidebar”。此外，我插入到页面中的所有 ID 和类都包含前缀“juxi”。问题是当我访问某些页面时，有时我的 CSS 格式会被弄乱，我不确定为什么会这样。当我在页面中搜索以“juxi”开头的任何 ID/类时，我只会看到自己的标签。

这是我如何插入节点的片段:

var sidebar = document.createElement('div');
sidebar.id = "juxiSidebar"; 
document.body.appendChild(sidebar);

Answer 1

不仅 ID 和 class 选择器会影响元素的样式，还有其他选择器，例如 div、body > div 等。

确保为您的元素设置所有相关样式。