Hvordan endre stilattributt til et element dynamisk ved hjelp av JavaScript?

Document Object Model (DOM) gir en funksjon for å kontrollere stilene dynamisk i webutvikling. For eksempel integreres det med JavaScript for å gi tilgjengelighet for å endre egenskapene til elementer. Det er nyttig å endre farge, bakgrunn og tekststørrelse i forskjellige applikasjoner i den virkelige verden. I denne artikkelen vil du endre stilattributtene til et element ved å bruke JavaScript.

Hvordan endre stilattributtet til et element dynamisk.

Det er enkelt å endre stilattributtet til et element ved å bruke JavaScript. Arbeidet med denne konverteringen er som følger. for det første, getElementById brukes til å få tilgang til elementene i dokumentobjekter. Etter det opprettes det en knapp som oppstår hvis klienten trykket på den. Derfor er egenskapen til et spesifikt element tilgjengelig, og brukeren endrer dynamisk stilattributtet til et element.

Syntaks

element.stil.PropertyName = "PropertyValue";

Parametere

Beskrivelsen av parametrene er som følger:

• eiendomsnavn: Angir navnet på eiendom som for eksempel farge, fontstørrelse osv.
• Eiendomsverdi: representerer verdien å tilordne egenskapen til et element, E, G, "Rød".

Eksempel

Et eksempel er tilpasset for å endre tekstfargen ved å få tilgang til stilattributtet til et element. Koden er gitt nedenfor ved å vurdere den dynamiske endringen av stilattributter.

Kode

Et eksempel for å endre de dynamiske egenskapene

Velkommen til JavaScript World "

Beskrivelsen av koden er forklart i en logisk rekkefølge.

• En knapp opprettes ved å gi verdien "Trykk på knappen".
• En "Pressbtn ()”Metoden er festet til denne knappen som utløses når den kalles.
• Etter det, metoden ovenfor “Pressbtn ()”Er skrevet innenfor Tagger.
• I denne metoden, MyElement Variabel brukes til å lagre elementattributtene.
• Endelig endres stilegenskapene til dette elementet dynamisk endret når Pressbtn () metoden kalles.

Produksjon

Etter å ha trykket på knappen “Trykk på knappen”, Pressbtn () metoden utløses, som endrer stilattributtet til dette spesifikke elementet dynamisk.

Endelig den svarte tekstfargen til “Velkommen til JavaScript”Forandres til rødt i nettleseren ved å bruke JavaScript Pressbtn () metode.

Konklusjon:

Først åpnes elementet ved hjelp av getElementById, og deretter dokumentet.stil.Eiendom er ansatt for å endre stilattributtet til elementet. Til slutt er en knapp tilknyttet den, og når denne knappen har trykket, endres stilen til elementet. Denne artikkelen demonstrerer den mulige metoden for å konvertere stilattributtet i JavaScript.