JS kann erkennen, dass Benutzer den Stil auf der Seite ändern, indem sie die Bedingungen auf der Seite auswählen. Der Seitenstil kann über Stil oder CSS geändert werden. Schauen wir uns JS an, um den Stilstil zu ändern. Der Code ist wie folgt:
<! DocType html public "-// w3c // dtd html 4.01 transitional // en"> <html> <head> <tits> change type = "text/css" href = "./ styles.css">-> <script langual = "javaScript"> Funktion test4 (Ereignis) {if (event.Value == "schwarz") {// Div1 var document.document.getElementById ('div1'); div1.style.backgroundcolor = "schwarz"; } if (event.Value == "rot") {// div1 var div1 = document.getElementById ('div1'); div1.style.backgroundcolor = "rot"; }} </script> </head> <body> <div1 = "div1"> div1 </div> <Eingabe type = "button" value = "schwarz" onclick = "test4 (this)"/> <input type = "button" value = "rot" onclick = "test4 (this)"/> </body> </html>>test4 (this) repräsentiert den Strom <Eingabe, der der Behandlung als Objekt entspricht.
Werfen wir einen Blick darauf, den CSS -Stil erneut zu ändern. Der Code lautet wie folgt:
<! DocType html public "-// w3c // dtd html 4.01 transitional // en"> <html> <head> <tits> Change1.html </title> <meta http-achh. href = "CSS/change.css"> <script langual = "javaScript"> Funktion test4 (Ereignis) {// Alle Klassenauswahl in das Style Sheet erhalten, um var ocssRules = document.stylesheets [0] .Rules zu erhalten; // Nehmen Sie die Klasse var style1 = ocssRules [0] heraus; if (event.Value == "schwarz") {//window.alert(style1.style.backgroundColor); style1.style.backgroundcolor = "schwarz"; } else if (event.Value == "rot") {style1.style.backgroundcolor = "rot"; }} </script> </head> <body> <div1 = "div1"> div1 </div> <Eingabe type = "button" value = "schwarz" onclick = "test4 (this)"/> <input type = "button" value = "rot" onclick = "test4 (this)"/> </body> </html>>Das obige ist der gesamte Inhalt der einfachen Beispiele für die Änderung des Stils und der CSS -Stile, die Ihnen vom Herausgeber zur Verfügung gestellt wurden. Ich hoffe, jeder wird Wulin.com mehr unterstützen ~