Javascript Ottieni L’Elemento Per Id
exp |
find |
JavaScript |
open |
sin
Michael Zippo
04.11.2021
Quindi, vuoi selezionare un elemento su una pagina web in JavaScript? Questa è la specialità del metodo getElementById, il cosiddetto re dell’elemento getters in JavaScript.
getElementById ti permette di selezionare un elemento in base al suo ID. è un nome di metodo abbastanza autoesplicativo se ci pensi.
In questa guida, parleremo di cosa è getElementById, come funziona funziona e quando dovresti usarlo nel tuo codice. Esamineremo un esempio di "Mostra/nascondi" pulsante di testo nella nostra demo document.getElementById.
Tuffiamoci!
Cos’è getElementById?
getElementById() è un metodo Document che seleziona un elemento dal DOM HTML su una pagina in base all’attributo ID elemento che hai specificato.
Considera il seguente codice:
Nel nostro codice HTML, abbiamo definito un elemento Trova il tuo Bootcamp Match
Puoi scegliere di utilizzare questo metodo se hai assegnato un ID a un elemento. Invece di usare un getter più ampio come querySelector o getElementByClass, che restituisce il primo oggetto elemento che soddisfa un particolare criterio, puoi recuperare un elemento usando getElementById().
getElementById() è un metodo comune utilizzato per recuperare un elemento in una pagina web.
Cosa devi sapere su getElementById
Prima di approfondire un esempio, parleremo degli errori che i principianti spesso commettono quando utilizzano questo metodo.
è sempre frustrante quando impari qualcosa di nuovo e non funziona, quindi parliamo di quali errori comuni potresti commettere mentre impari a getElementById().
In primo luogo, getElementById() fa distinzione tra maiuscole e minuscole. Mentre il termine ID è solitamente in maiuscolo nella programmazione, devi utilizzare il caso del cammello Id quando utilizzi questo metodo. In caso contrario, questo metodo non funzionerà.
Secondo, l’ID che specifichi non deve includere un cancelletto (hashtag). Considera questo codice:
Questo esempio potrebbe sembrare che recupererà l’elemento con l’ID mainButton, ma non è cosi. Devi solo specificare l’ID dell’elemento che desideri recuperare:
Ora che è fuori mano, possiamo passare attraverso un esempio.
Come usare getElementById
Quando navighi sul Web, potresti incontrare tag che dicono "Leggi di più". Una pagina web può mostrare alcune frasi di una parte di testo, quindi ti viene chiesto di premere quel pulsante in modo da poter vedere il resto del testo.
Costruiremo quella funzione utilizzando getElementB yId() getter. Puoi visualizzare il codice finale per questo tutorial su GitHub.
Creazione del front-end
Cominciamo creando un semplice front-end utilizzando HTML e CSS. Crea un nuovo file chiamato index.html e incolla il seguente codice:
JavaScript getElementById()
Vuoi saperne di più su getElementById()? Sei nel posto giusto.
Ulteriori informazioni getElementById() è un metodo JavaScript che consente di selezionare un elemento in una pagina web. Questo metodo viene comunemente chiamato "getter" perché "ottene" un elemento da una pagina.
