Kann ich CSS-Klassenregeln dynamisch mit jQuery ändern?

So ändern Sie CSS-Klassenregeln dynamisch mit jQuery

Frage:

• Wie kann ich bestimmtes CSS ändern? Regeln für eine Klasse mit jQuery, ohne Inline-Stile hinzuzufügen?
• Ist es möglich, diese Änderungen dauerhaft in einer Datei zu speichern?

Antwort:

Während jQuery nicht direkt eine Methode zum Ändern von CSS-Regeln bereitstellt, gibt es zwei Ansätze, um Ihre Aufgaben zu erfüllen:

a. Ändern von CSS-Regeln im Handumdrehen:

• Mit der Eigenschaft document.styleSheets von JavaScript können Sie auf die Stylesheet-Regeln zugreifen.
• Durchlaufen Sie die Regeln und suchen Sie die mit Ihnen verknüpfte Regel Zielklasse.
• Verwenden Sie die Eigenschaft „rules[j].style“, um die gewünschte CSS-Eigenschaft zu ändern, z. B. „font-size“.
• Beispiel:

<code class="javascript">var ss = document.styleSheets;

for (var i = 0; i < ss.length; i++) {
    var rules = ss[i].cssRules || ss[i].rules;

    for (var j = 0; j < rules.length; j++) {
        if (rules[j].selectorText === ".classname") {
            rules[j].style.fontSize = "16px";
        }
    }
}</code>

b. Stiländerungen in einer Datei speichern:

• Dieser Prozess erfordert eine serverseitige Implementierung.
• Lesen Sie die geänderten CSS-Deklarationen mithilfe der document.styleSheets-Eigenschaft wie oben erläutert.
• Verwenden Sie JavaScript, um eine Zeichenfolge zu erstellen, die das aktualisierte CSS enthält.
• Senden Sie eine Ajax-POST-Anfrage mit der CSS-Zeichenfolge als Nutzlast an den Server.
• Speichern Sie auf der Serverseite die geändertes CSS in eine Datei zur dauerhaften Speicherung.

Referenzen:

• [document.styleSheets (Mozilla)](https://developer. mozilla.org/en-US/docs/Web/API/Document/styleSheets)
• [CssRule-Objekt (Mozilla)](https://developer.mozilla.org/en-US/docs/Web/ API/CSSRule)
• [document.styleSheets (MSDN)](https://docs.microsoft.com/en-us/ previous-versions/ie8/cc330629(v=vs.85))
• [CssRule-Objekt (MSDN)](https://docs.microsoft.com/en-us/ previous-versions/ie8/cc330627(v=vs.85))

Das obige ist der detaillierte Inhalt vonKann ich CSS-Klassenregeln dynamisch mit jQuery ändern?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!