Comment définir le style CSS des éléments dans js

Méthode de paramétrage : 1. Utilisez l'instruction "object.setAttribute('style', 'property: value')" ; 2. Utilisez l'instruction "object.style.setProperty('property', 'value') " ; 3. Utilisez l'instruction "Object.style.cssText='Property:Value'".

L'environnement d'exploitation de ce tutoriel : système Windows 7, JavaScript version 1.8.5, ordinateur Dell G3.

Méthode 1 : Utiliser setAttribute()

<p id="p">hello world<p>

<button onclick="myFunction()">点击按钮，设置css样式</button>

<script>
function myFunction() {
	document.getElementById("p").setAttribute(&#39;style&#39;, &#39;color:#FF0000&#39;);
}
</script>

Rendu :

Méthode 2 : Utiliser setProperty()

<p id="p">hello world<p>

<button onclick="myFunction()">点击按钮，设置css样式</button>

<script>
function myFunction() {
	document.getElementById("p").style.setProperty(&#39;font-size&#39;, &#39;50px&#39;);
}
</script>

Rendu :

Méthode 3 : attribut cssText

<p id="p">hello world<p>

<button onclick="myFunction()">点击按钮，设置css样式</button>

<script>
function myFunction() {
	document.getElementById("p").style.cssText=&#39;font-size:50px;color: red;&#39;;
}
</script>

Rendu :

[Apprentissage recommandé : Tutoriel avancé javascript]

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!