1. So verwenden Sie js, um CSS-Attribute zu bedienen
1. Für CSS-Attribute ohne Bindestrich verwenden Sie im Allgemeinen direkt den Stilattributnamen.
Wie zum Beispiel: obj.style.margin, obj.style.width, obj.style.left, obj.style.position
2. Entfernen Sie bei CSS-Attributen, die Unterstriche enthalten, jeden Unterstrich und ersetzen Sie das erste Zeichen nach jedem Unterstrich durch Großbuchstaben.
Wie zum Beispiel: obj.style.marginTop, obj.style.borderLeftWidth, obj.style.zIndex, obj.style.fontFamily usw.
3. Spezielle Schreibmethode für JS zur Bedienung des CSS-Float-Attributs
Da float ein reserviertes Wort von JavaScript ist, können wir obj.style.float nicht direkt verwenden, da dieser Vorgang ungültig ist. Die korrekte Verwendungsmethode ist: IE: obj.style.styleFloat, andere Browser wie Mozilla (Gecko), ff usw. verwenden styleFloat: obj.style.cssFloat.
2. Verwenden Sie js, um CSS-Attributwerte zu erhalten
1. Holen Sie sich den Inline-Stil: obj.style-Attributname.
2. Holen Sie sich die CSS-Attribute innerhalb der Klasse und außerhalb des Links: IE verwendet die Methode obj.currentStyle["property name"], während FF die Methode getComputedStyle verwendet
3. Verwenden Sie js, um CSS-Attributen Werte zuzuweisen
1. Klassenattribut zuweisen
Aufgabe: document.getElementById('ceil').className = "class1";
Wenn es mehrere Werte hat: document.getElementById('ceil').className = "class1 class2 class3";
2. obj.style.cssText legt den CSS-Stil eines Objekts fest
document.getElementById('navition').style.cssText = "Ihr CSS-Code';
Zusammenfassung
Zu wissen, wie man die auf eine Seite angewendeten Stile dynamisch ändert, ist für die Erstellung stilvoller und interaktiver Webseiten äußerst nützlich – das in diesem Artikel erläuterte Wissen bildet die Grundlage für fortgeschrittenere Techniken wie JavaScript-Animationen. Es ist wichtig zu beachten, dass Sie mit dynamischen Stiländerungen verantwortungsbewusst umgehen und sie nicht überbeanspruchen sollten. Wie bereits erwähnt, können Stiländerungen auch die Webeffizienz verbessern – das Ein- und Ausblenden von Inhalten kann dazu beitragen, unnötige Dateninteraktionen zwischen Client und Server zu vermeiden.
