Firefox：样式表在开发者工具中出现多次

Question

我在示例站点上有一些链接样式表（ https://responsive.webcraft101.com/index.html ）。 其中一个链接将被打开和关闭，因此它包含一个id ：

<link id="sketch" rel="stylesheet" type="text/css" href="styles/sketch.css">

我在 header 元素上添加了一些header元素，该元素禁用和启用样式表。 一个简化的版本是：

var ss = document.querySelector('link#sketch');
var header = document.querySelector('header');
header.onclick = event => { ss.disabled = !ss.disabled; } ;

它工作得很好。 但是，当我查看 Firefox 开发人员工具中的样式表时，每次disabled设置为false时， sketch.css样式表都会添加到列表中。

这是否表明该过程有问题？ 我怎样才能阻止这种情况发生？

Answer 1

我可以看到它发生在firefox但不勇敢。 我不确定它是否真的有那么多副本，或者它是否只是显示应用它们的日志。 就个人而言，我不会这样做。 我认为您可以通过在您切换的主体中安装一个 class 来做到这一点。 我不认为这是一个预期的设计参数。 它不是视觉元素。

我只看到这被用作延迟加载样式表的一种方式。 然后他们添加一个链接而不是启用它。

这里的用法示例

Answer 2

这显然是样式编辑器中的一个错误。 看起来它将在即将发布的 Firefox 版本中修复。