Atributo desativado de "link" HTML (folha de estilos)

Estou usando JavaScript para ativar / desativar folhas de estilo usando o seguinte:

<code>document.styleSheets[0].disabled = true|false;
</code>

Este JS funciona bem, no entanto, gostaria que a folha de estilo fosse Desativada por padrão. Embora eu possa usar o JS acima para desativar imediatamente a folha de estilo quando a página for carregada, isso obviamente não funcionará para usuários com JavaScript desativado.

Eu tentei fazer isso:

<code><link rel="stylesheet" href="style.css" disabled />
</code>

Embora isso desative a folha de estilo, JavaScript (ou pelo menos o método que estou usando) não pode ativá-lo novamente. Eu também tentei todas essas variações no atributo "desativado":disabled="disabled", disabled="true" edisabled=true, mas estes produzem o mesmo problema - não posso ativá-los novamente com JavaScript.

Em suma, preciso de uma maneira de ativar / desativar uma folha de estilos externa usando JavaScript, mas tenho essa folha de estilo desativada por padrão, mas não depende de JavaScript.

Qualquer ajuda seria muito apreciada. Obrigado.

N.B. Esse efeito pode ser obtido usando duas folhas de estilo, a segunda substituindo a primeira, portanto, não há necessidade do atributo "disabled". No entanto, é obviamente preferível usar apenas uma única folha de estilo, se possível, daí a minha pergunta acima.

questionAnswers(3)

yourAnswerToTheQuestion