Imposta la proprietà CSS in JavaScript

JavaScript è uno dei linguaggi e le tecnologie di script core del World Wide Web. È un linguaggio di programmazione in esecuzione dinamicamente. CSS è la lingua utilizzata per controllare lo stile dei documenti scritti in linguaggi di markup come HTML e XHTML.

Le proprietà CSS possono essere applicate a un codice scritto in JavaScript in un documento HTML facilmente accedendo all'elemento su cui la proprietà deve essere applicata tramite JavaScript e applicando direttamente la proprietà CSS su di essa.

Impostazione della proprietà CSS in JavaScript

Facciamo un esempio di un semplice codice HTML per formattare il documento JavaScript:

Fai clic su OK per cambiare il mio colore

OK

Nel frammento di codice sopra, c'è un'intestazione che abbiamo assegnato un ID "test". Di seguito, abbiamo creato un pulsante "OK"Attraverso l'etichetta del pulsante e ha dichiarato il"al clic"Funzione per quel pulsante. Questo specifica questo quando il "OKIl pulsante "verrà cliccata, il"Func ()"La funzione JavaScript verrà invocata e la proprietà CSS definita all'interno di tale funzione verrà implementata nel testo scritto in HTML.

Di seguito è riportata una funzione JavaScript per rendere il codice HTML sopra eseguibile dinamicamente:

funzione func ()
var y = documento.getElementById ("testo");
y.stile.color = "rosso";

Lo snippet di codice sopra ha una funzione denominata "Func ()"In cui una variabile"y"È inizializzato e il"getelementbyid"Il metodo è dichiarato per riferirsi al"testo"ID che ha il testo (contenuto). Quindi, c'è la proprietà CSS inserita per cambiare il colore del testo in rosso.

Questo visualizzerà un testo nell'interfaccia di output che facendo clic sul pulsante OK cambierà il colore del testo in rosso:

In questo modo, possiamo impostare le proprietà CSS in JavaScript.

Conclusione

Possiamo impostare le proprietà CSS in un elemento in JavaScript accedendo innanzitutto all'ID, alla classe o all'attributo di quell'elemento utilizzando il metodo Get pertinente. Ad esempio, nel post sopra, abbiamo applicato il "getelementbyid" metodo. Dopodiché, definisci semplicemente la proprietà CSS da applicare a quell'elemento. Questo articolo ha spiegato bene come impostare le proprietà CSS in JavaScript.