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 版本中修復。