Hvordan endre en elementbakgrunnsfarge i JavaScript

Ved hjelp av JavaScript kan det hende du må markere noen data eller et element på websiden din. Det forbedrer også elementets synlighet ved å bruke forskjellige farger og gjør den overordnede websiden mer attraktiv. I slike tilfeller er å legge til og endre bakgrunnsfargen på et element veldig effektiv for å fange leserens oppmerksomhet og forbedre nettsteddesignet.

Denne oppskrivningen vil guide deg til å endre elementets bakgrunn i JavaScript.

Hvordan endre en elementbakgrunnsfarge i JavaScript?

For å endre bakgrunnsfargen på et element i JavaScript, bruk følgende teknikker:

• Bakgrunnsfargeegenskaper med farge
• Bakgrunnsfargeegenskaper med fargekode

De nevnte tilnærmingene vil bli demonstrert en etter en!

Metode 1: Endre et elementbakgrunnsfarge i JavaScript ved å bruke bakgrunnsfargegenskaper med farge

“bakgrunnsfarge”Eiendom setter bakgrunnsfargen på det spesifiserte elementet. Denne egenskapen kan implementeres på hvilket som helst av de ekstra HTM -elementene ved å få tilgang til ID -en og tildele den en bakgrunnsfarge.

Syntaks

Her, "gjenstand”Refererer til elementet som bakgrunnsfargen vil bli brukt på.

Følgende eksempel forklarer det uttalte konseptet.

Eksempel

I eksemplet nedenfor vil overskriftstoden bli tildelt en ID som heter “id" og "Bakgrunnsfarge!”Verdi:

Neste, i JavaScript -filen, "dokument.getElementById ()”Metode vil få tilgang til“id”Av overskriftselementet. Etter det vil bakgrunnsfargeegenskapen tilordne fargeverdien “Lysegrønn”Mot ID -en, som refererer til den spesifiserte overskriftsverdien i forrige trinn:

Utgangen fra implementeringen ovenfor vil resultere som følger:

I utgangen observeres det at bakgrunnsfargen bare brukes på det valgte overskriftselementet.

Metode 2: Endre en elementbakgrunnsfarge i JavaScript ved å bruke BackgroundColor -egenskap med fargekode

Som diskutert tidligere, "bakgrunnsfarge”Eiendom setter bakgrunnsfargen på det spesifiserte elementet. Denne egenskapen kan også implementeres på det spesifiserte elementet ved hjelp av RGB -fargekoden.

Se på følgende eksempel for demonstrasjon:

Eksempel

For det første vil vi legge til et avsnitt ved hjelp av

Merk og tilordne den en ID som heter “id”Og en verdi som vist nedenfor:

Neste, “getElementById ()”Metoden vil på samme måte få tilgang til avsnittselementet med den spesifiserte IDen og tilordne bakgrunnsfargen ved hjelp av bakgrunnsfargens egenskap. Her, “#090”Indikerer“RGB”Kode for middels mørk nyanse av grønn farge:

Produksjon

I implementeringen ovenfor er den grønne fargen et resultat av "RGB-> 090”, Der 9 refererer til intensiteten til den grønne fargen.

Konklusjon

For å endre bakgrunnsfargen på et element i JavaScript, "bakgrunnsfarge”Eiendom med fargemetoden kan brukes for å få tilgang til den spesifikke ID -en og tilordne en bestemt bakgrunnsfarge. Det brukes med "RGB”Kode for å bruke en spesifikk fargeskygge på det valgte HTML -elementet. Denne artikkelen guidet relatert til metoden for å endre elementets bakgrunnsfarge i JavaScript.