Metodo getElementById() del documento HTML DOM

Definizione e uso

getElementById() Il metodo restituisce l'elemento con il valore id specificato.

Se l'elemento non esiste,getElementById() Il metodo restituirà null.

getElementById() Il metodo è uno dei metodi più utilizzati in HTML DOM.Quasi ogni volta che si desidera leggere o modificare un elemento HTML, si utilizza esso.

Suggerimento

Ogni id dovrebbe essere unico, ma:

Se ci sono due o più elementi con lo stesso id, allora getElementById() Restituisce il primo.

Vedi anche:

Metodo getElementsByTagName()

Metodo getElementsByClassName()

Metodo querySelector()

Metodo querySelectorAll()

Esempio

Esempio 1

Ottieni l'elemento con id specificato:

document.getElementById("demo");

Prova personalmente

Esempio 2

Ottieni l'elemento e cambia il suo colore:

const myElement = document.getElementById("demo");
myElement.style.color = "red";

Prova personalmente

Esempio 3

oppure cambiare solo il suo colore:

document.getElementById("demo").style.color = "red";

Prova personalmente

Prova personalmente

document.getElementById(elementIdSintassi

)

) Tipo
elementId Parametro

Obbligatorio. Il valore dell'id dell'elemento.

Valore di ritorno Tipo
Descrizione

Oggetto

L'elemento con l'id specificato.

Se non trovato, restituisce null.

getElementById() Dettagli tecnici

Questo metodo è un metodo importante e comune perché fornisce un metodo semplice per ottenere l'oggetto Elemento che rappresenta l'elemento del documento specificato. elementId Questo metodo recupera l'attributo con il valore id null. Il valore dell'attributo id è unico nel documento, se questo metodo trova più nodi Elemento con l'id specificato, li restituisce. Se non trova un tale elemento Elemento, restituisce elementId Il nodo Elemento di Element, che restituisce casualmente un tale nodo Elemento o restituisce null.

Attenzione:Il nome di questo metodo inizia con Id alla fine, non ID，non scrivere male!

Nel documento HTML, questo metodo sempre recupera l'attributo con l'id specificato. Usa HTMLDocument.getElementByName() Il metodo cerca gli elementi HTML in base al valore della loro proprietà name.

Nel documento XML, questo metodo utilizza qualsiasi attributo di tipo id per cercare, indipendentemente dal nome dell'attributo. Se il tipo dell'attributo XML è sconosciuto (ad esempio, il parser ignora o non può localizzare il DTD del documento), questo metodo restituisce sempre nullNel JavaScript client-side, questo metodo non viene utilizzato spesso insieme ai documenti XML. In effetti,getElementById() Il metodo è stato definito originariamente come membro dell'interfaccia HTMLDocument, ma è stato aggiunto all'interfaccia Document nel livello 2 del DOM.

Supporto del browser

document.getElementById() È una caratteristica di DOM Level 2 (2001).

Tutti i browser lo supportano:

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
Supporto 9-11 Supporto Supporto Supporto Supporto

Pagine correlate

Manuale CSS:Sintassi CSS

Manuale CSS:Selettore #id CSS

Manuale HTML DOM:Proprietà id HTML DOM

Manuale HTML DOM:Oggetto Style HTML DOM