wählen Sie CSS-URL dynamisch über Javascript

Question

Gibt es eine Möglichkeit, eine <link rel="stylesheet" type="text/css"> mit der URL dynamisch ausgewählt basierend auf einigen Javascript-Ausdruck Auswertung hinzufügen?

(ohne jQuery oder andere externe Bibliothek. - Ich Abhängigkeiten von externen Bibliotheken vermeiden will)

Insbesondere mag ich während oder als Folge von Pageload einige Javascript laufen, anstatt zu einem späteren Zeitpunkt , aber ich möchte sicherstellen, dass das CSS, das ersetzt oder hinzugefügt wurde, als Ergebnis der Ausführung von Javascript geladen wird.

Answer 1

Try this:

Funktion:

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

Activate:

<button onclick="swapStyleSheet('dark.css')">Dark Style Sheet</button> 

Answer 2

Sie sind willkommen, um diese Funktion zu versuchen.

function addStylesheet(file) { 
    var 
     head = document.getElementsByTagName("head")[0], 
     style = document.createElement("link"); 
    style.rel = "stylesheet"; 
    style.type = "text/css"; //optional 
    style.href = file; 
    head.appendChild(style); 
} 

addStylesheet("style.css");