L'acronimo di HTML DOM per il modello di oggetti documenti è un'interfaccia di programmazione per i documenti scritti in HTML e XML. Fornisce una struttura logica ai documenti. HTML DOM definisce come i documenti HTML possono essere valutati e modificati. Utilizzando HTML Dom È possibile modificare lo stile degli elementi HTML tramite JavaScript.

La proprietà di stile di HTML DOM viene utilizzata allo scopo di cambiare lo stile degli elementi HTML.

Proprietà in stile di HTML Dom

Un attributo di stile di un elemento HTML è rappresentato da un oggetto CSSSTILEDECLARATION. Al fine di restituire questo oggetto CSSSTILEDEDECLARAZIONE, viene utilizzata la proprietà di stile. Questa proprietà viene utilizzata per ottenere o impostare lo stile di elementi utilizzando varie proprietà CSS.

Sintassi

La sintassi della proprietà in stile DOM HTML è fornita come segue.

Se si desidera semplicemente ottenere una proprietà di stile, usa la seguente sintassi.

Tuttavia, se si desidera impostare una proprietà di stile, utilizzare la sintassi data

Ora che abbiamo una comprensione di base di ciò che è la proprietà in stile Dom HTML. Ora esploreremo alcuni esempi pertinenti.

Cambiando stile HTML

Gli esempi dati dimostrano come possiamo cambiare lo stile degli elementi HTML usando JavaScript.

Esempio 1
Supponiamo che tu voglia cambiare il colore di

Elemento usando il suo ID.

Proprietà in stile Dom HTML

Proprietà in stile Dom HTML

Nell'esempio sopra, abbiamo appena definito due

elementi e assegnato loro un ID univoco.

Proprietà in stile Dom HTML

Proprietà in stile Dom HTML

Abbiamo quindi cambiato il colore di

Elemento con id = "para2". Nel seguente pezzo di codice in cui stiamo semplicemente ottenendo il nostro elemento desiderato dal suo ID e cambiando il suo colore in rosso.

Ecco come appariva prima di cambiare il colore.

Dopo aver cambiato il colore.

Esempio 2
Supponiamo che tu voglia cambiare il colore e la famiglia del carattere di

Elemento usando il suo ID.

Imparare HTML Dom

Imparare HTML Dom

Nell'esempio sopra, abbiamo appena definito due

elementi e assegnato loro un ID univoco.

Imparare HTML Dom

Imparare HTML Dom

Abbiamo quindi cambiato il colore e la famiglia dei caratteri di

elemento con id = "head2". Nel seguente pezzo di codice in cui stiamo semplicemente ottenendo il nostro elemento desiderato dal suo ID e cambiando il suo colore in famiglia blu e carattere in Arial.

Errore Geshi: Geshi non è riuscito a trovare il linguaggio del linguaggio (usando il percorso/home/nginx/domini/linuxhint.com/public/wp-content/plugins/codecolorer/lib/geshi/) (codice 2)

Ecco come appariva prima di cambiare il colore e la famiglia dei caratteri.

Dopo aver cambiato il colore e la famiglia dei caratteri sembra così.

Conclusione

Per modificare lo stile degli elementi HTML usando JavaScript, utilizziamo la proprietà in stile DOM HTML. La proprietà in stile Dom HTML consente di ottenere o impostare lo stile di un elemento HTML. Ci possono essere approcci diversi per utilizzare questa proprietà per modificare lo stile degli elementi HTML. Questo tutorial copre la proprietà in stile Dom HTML e diversi approcci che possono essere utilizzati per cambiare lo stile degli elementi HTML.