Heim > Web-Frontend > js-Tutorial > So legen Sie CSS in nativem JS fest

So legen Sie CSS in nativem JS fest

醉折花枝作酒筹
Freigeben: 2023-01-05 16:10:13
Original
3927 Leute haben es durchsucht

Methode: 1. Verwenden Sie die Anweisung „style.property=value“ zum Festlegen. 2. Verwenden Sie die Anweisung „setAttribute(property, value)“ zum Festlegen set; 4. Verwenden Sie die Anweisungseinstellung „style.cssText='property:value'“.

Die Betriebsumgebung dieses Tutorials: Windows 7-System, JavaScript-Version 1.8.5, Dell G3-Computer.

Verwenden Sie JS, um CSS-Stile dynamisch festzulegen (auf Inline-Stile setzen). Die häufigsten sind wie folgt: 1. Legen Sie das Stilattribut direkt fest. In einigen Fällen ist diese Einstellung ungültig Wenn das Attribut ein „-“-Zeichen enthält, schreiben Sie es in Kamel-Schreibweise (z. B. textAlign). Wenn Sie das „-“-Zeichen beibehalten möchten, schreiben Sie es in eckige Klammern element.style['text-align'] = '100px ';

element.style.height = '100px';
Nach dem Login kopieren
2. Attribute direkt festlegen

(kann nur für bestimmte Attribute verwendet werden, verwandte Stile werden automatisch erkannt)

element.setAttribute('height', 100);
element.setAttribute('height', '100px');
Nach dem Login kopieren
3. Wenn Sie !important festlegen möchten, wird dies empfohlen Verwenden Sie diese Methode, um den dritten Parameter festzulegen.

element.style.setProperty('height', '300px', 'important');
Nach dem Login kopieren
4

Das obige ist der detaillierte Inhalt vonSo legen Sie CSS in nativem JS fest. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage