Ändern von CSS über alle Seiten

Question

Ich möchte in der Lage sein, zwischen zwei verschiedenen Stylesheets zu wechseln und den ausgewählten Stil auf der Startseite beizubehalten, aber die Verwendung auf allen Seiten konsistent zu halten.

<link id="pagestyle" rel="stylesheet" href="style1.css"> 
<script type="text/javascript"> 
    function swapStyleSheet(sheet){ 
    document.getElementById('pagestyle').setAttribute('href', sheet); 
    } 
</script> 

<button onclick="swapStyleSheet('style.css')">Blue</button> 
<button onclick="swapStyleSheet('style1.css')">White</button> 

Dies ändert sich nur das Stylesheet für die Homepage, aber wie bewerbe ich mich um diese Änderung auf alle anderen Seiten auf der Website?

Answer 1

Sie können den lokalen Speicher zum Speichern des aktuellen Stylesheets verwenden.

var stylesheet = localStorage.getItem("stylesheet"); 

function swapStyleSheet(sheet){ 
    document.getElementById('pagestyle').setAttribute('href', sheet); 
    localStorage.setItem('stylesheet', sheet); 
} 

if(stylesheet) { 
    swapStyleSheet(stylesheet) 
}