So fügen Sie Stil in Javascript hinzu

So fügen Sie Stile in JavaScript hinzu: 1. Über die Methode „document.getElementById(„box“);“ 2. Über die Methode „head.style.cssText="..."; Verfahren.

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

Wie fügt man Javascript Stil hinzu?

js fügt CSS-Stile hinzu

Hier ist ein einfacher Fall:

Wir möchten dem div Stile mit der ID von box hinzufügen. Wir werden Breite, Höhe und Hintergrundfarbe hinzufügen.

Methode 1:

var head= document.getElementById("box"); //获取到id为box的div标签元素。
head.style.width = "70px"; //设置宽度为70
head.style.height = "70px";//设置高度为70
head.style.display = "#ccc";//设置背景色为灰色

Diese Methode ist relativ einfach, aber wenn es viele CSS-Stile wie Rand, Abstand, Schriftgröße usw. gibt und wir immer noch so schreiben, wird es eine Menge sein. Zu diesem Zeitpunkt können wir Methode zwei verwenden.

Methode 2:

var head= document.getElementById("box");//获取到id为box的div标签元素。
head.style.cssText="width:70px;height:70px;display:#ccc";

In dieser Methode verwenden wir „cssText“, was den Code stark reduziert. Genau wie das Schreiben in eine CSS-Quelldatei.

Methode 3: Verwenden Sie setProperty

element.style.setProperty('height', '300px', 'important');

Wenn Sie !important festlegen möchten, wird empfohlen, diese Methode zum Festlegen des dritten Parameters zu verwenden

Empfohlenes Lernen: „Javascript Advanced Tutorial“

Das obige ist der detaillierte Inhalt vonSo fügen Sie Stil in Javascript hinzu. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!