Come ottenere il valore dell'area di testo in JavaScript?

Nel processo di progettazione di pagine Web o siti reattive, è necessario richiedere all'utente i dati inseriti al fine di garantire i dati inseriti corretti. Ad esempio, confermando le mail e le password digitate. Nell'altro caso, registra un errore o un avviso su un'opzione selezionata che potrebbe portare a alcune gravi conseguenze I.e virus ecc. In tali casi scenari, ottenere il valore dell'area di testo in JavaScript è molto utile per mantenere la privacy dei dati.

Questo articolo spiegherà gli approcci per ottenere il valore dell'area di testo in JavaScript.

Come ottenere il valore dell'area di testo in JavaScript?

Il valore dell'area di testo può essere recuperato in JavaScript usando i seguenti approcci:

• "getElementById ()" metodo.
• "addEventListener ()" metodo.
• "jQuery".

Approccio 1: ottenere il valore dell'area di testo in javascript utilizzando il metodo getElementById ()

IL "getElementById ()"Il metodo accede a un elemento con il specificato"id".Questo metodo può essere implementato per recuperare il campo di testo di input e restituire il valore immesso in esso.

Sintassi

documento.getElementById (elemento)

Nella sintassi data:

• "elemento" si riferisce a "id"Essere recuperati contro l'elemento particolare.

Esempio
Diamo un'occhiata al seguente esempio:

Applichiamo i seguenti passaggi nel codice seguente:

Ottieni il valore dell'area di testo in JavaScript

Scrivi qualcosa:
Ottieni valore

Eseguire i seguenti passaggi:

• Nel primo passaggio, specificare l'intestazione dichiarata.
• Successivamente, includi il campo di testo di input con il specificato "id" E "segnaposto" valore.
• Inoltre, crea un pulsante con un allegato "al clic"Reindirizzamento degli eventi alla funzione textAreavalue ()

Andiamo avanti verso la parte JavaScript del codice:

Nel codice JavaScript sopra:

• Dichiarare una funzione denominata "textAreavalue ()".
• Nella sua definizione, accedi al campo di testo di input mediante l'ID specificato usando "getElementById ()" metodo.
• Inoltre, applica il "valore"Proprietà al fine di recuperare il valore di testo immesso.
• Infine, visualizza il valore dell'area di testo tramite "mettere in guardia"Dialogo.

Produzione

Nell'output sopra, si può osservare che il valore immesso viene recuperato tramite dialogo di avviso.

Approccio 2: ottenere il valore dell'area di testo in JavaScript utilizzando il metodo AddeventListener ()

IL "addEventListener ()"Il metodo viene utilizzato per associare un"evento"Con un elemento. Questo metodo può essere utilizzato per allegare un evento alla funzione in modo tale che il valore dell'area di testo sia recuperato su ciascun ingresso fianco a fianco sulla console.

Sintassi

elemento.addEventListener (Event, Function, Exec)

Nella sintassi sopra:

• "evento"Punta il nome dell'evento.
• "funzione"Indica la funzione da eseguire sul trigger di un evento.
• "Exec"È il parametro opzionale.

Esempio
Seguiamo l'esempio seguente passo dopo passo:

Scrivi qualcosa:

In code-snippet sopra:

• Specificare l'etichetta dichiarata. Inoltre, alloca il "textrea"Elemento con il valore specificato di"id" E "segnaposto"E regola anche le sue dimensioni.
• Nella parte di JavaScript del codice, accedi alla textarA specificata nel passaggio precedente e visualizzalo usando "valore" proprietà.
• Nel passaggio successivo, allega un evento "testo"Ai recupero"area di testo" usando il "addEventListener ()"Metodo e applicarlo alla funzione"textAreavalue ()". IL "evento"Nel suo argomento passa informazioni sull'evento che viene attivato.
• Ciò comporterà la registrazione di ciascuno dei valori di testo inseriti fianco a fianco.

Produzione

Dall'output sopra, il "recuperare"Di ciascuno dei valori di testo immessi può essere osservato.

Approccio 3: ottenere il valore dell'area di testo in JavaScript usando jQuery

"jQuery"Può essere applicato per accedere al campo di testo di input e attivare le sue funzionalità non appena viene caricato il modello a oggetti documentali (DOM).

Esempio
Seguiamo l'esempio di seguito:

Scrivi qualcosa:
Ottieni valore

Nelle righe di codice sopra, eseguire i seguenti passaggi:

• Includi la libreria jQuery per applicare i suoi metodi.
• Specificare la "ingresso"Come campo di testo con i valori specificati di"id" E "segnaposto"Come discusso prima.
• Inoltre, crea un pulsante per ottenere il valore sul clic del pulsante.

Passa alla parte JavaScript del codice:

Segui i passaggi dichiarati:

• Applicare il "pronto()"Metodo per applicare gli ulteriori metodi sul DOM caricato.
• Accedi al pulsante creato e allega il "clic()"Metodo ad esso che eseguirà la funzione dichiarata nel suo parametro.
• Il metodo Click () accederà al campo di testo di input specificato e registrerà il valore di testo immesso sulla console.

Produzione

Quindi, il valore del tipo è registrato sulla console.

Questi erano tutti i diversi modi per ottenere il valore dell'area di testo con l'aiuto di JavaScript.

Conclusione

IL "getElementById ()Metodo ", il"addEventListener ()Metodo o il "jQuery"Può essere utilizzato per ottenere il valore dell'area di testo in JavaScript. Il metodo getElementById () può essere implementato per accedere al campo di testo di input e visualizzare il valore dell'area di testo immessa tramite avviso. Il metodo addEventListener () può essere utilizzato per allegare un "ingresso"Evento che otterrà il valore di testo su ciascun input fianco a fianco. Il jQuery può essere applicato per accedere direttamente al pulsante e recuperare il valore di testo immesso al pulsante Clicca sulla console. Questo tutorial spiega come ottenere il valore dell'area di testo in JavaScript.