Cómo obtener el valor del área de texto en JavaScript?

Cómo obtener el valor del área de texto en JavaScript?
En el proceso de diseño de páginas web o sitios receptivos, es necesario solicitar al usuario de los datos ingresados ​​para asegurarse de que los datos ingresados ​​correctos. Por ejemplo, confirmando los correos y contraseñas tipificados. En el otro caso, registrar un error o advertencia sobre una opción seleccionada que podría conducir a una consecuencia seria I.E virus, etc. En tales casos-escenarios, obtener valor del área de texto en JavaScript es muy útil para mantener la privacidad de los datos.

Este artículo explicará los enfoques para obtener el valor del área de texto en JavaScript.

Cómo obtener el valor del área de texto en JavaScript?

El valor del área de texto se puede obtener en JavaScript utilizando los siguientes enfoques:

  • "getElementById ()" método.
  • "addEventListener ()" método.
  • "jQuery".

Enfoque 1: Obtenga el valor del área de texto en JavaScript utilizando el método GetElementById ()

El "getElementById ()"El método accede a un elemento con el especificado"identificación".Este método se puede implementar para obtener el campo de texto de entrada y devolver el valor ingresado en él.

Sintaxis

documento.getElementById (elemento)

En la sintaxis dada:

  • "elemento" se refiere a "identificación"Ser recuperado contra el elemento particular.

Ejemplo
Echemos un vistazo al siguiente ejemplo:

Aplicemos los siguientes pasos en el siguiente código:

Obtener valor de área de texto en JavaScript


Escribe algo:

Realice los siguientes pasos:

  • En el primer paso, especifique el encabezado declarado.
  • Después de eso, incluya el campo de texto de entrada con el especificado "identificación" y "marcador de posición" valor.
  • Además, cree un botón con un adjunto "al hacer clic"Redirección de eventos a la función textareAsAValue ()

Pasemos hacia adelante a la parte JavaScript del código:

En el código JavaScript anterior:

  • Declarar una función llamada "textareAsAValue ()".
  • En su definición, acceda al campo de texto de entrada por su identificación especificada utilizando el "getElementById ()" método.
  • Además, aplique el "valorPropiedad para recuperar el valor de texto ingresado.
  • Finalmente, muestre el valor del área de texto a través del "alerta"Cuadro de diálogo.

Producción

En la salida anterior, se puede observar que el valor ingresado se obtiene a través del cuadro de diálogo de alerta.

Enfoque 2: Obtener valor de área de texto en JavaScript utilizando el método AddEventListener ()

El "addEventListener ()"El método se utiliza para asociar un"evento"Con un elemento. Este método se puede utilizar para adjuntar un evento a la función de modo que el valor del área de texto se obtenga en cada entrada lado a lado en la consola.

Sintaxis

elemento.addEventListener (evento, función, ejecutivo)

En la sintaxis anterior:

  • "evento"Señala el nombre del evento.
  • "función"Indica la función para ejecutarse sobre el disparador de un evento.
  • "ejecución"Es el parámetro opcional.

Ejemplo
Sigamos el ejemplo de paso a continuación paso a paso:





En el código anterior-snippet:

  • Especificar la etiqueta indicada. Además, asigne el "textea"Elemento con el valor especificado de"identificación" y "marcador de posición"Y ajuste sus dimensiones también.
  • En la parte de JavaScript del código, acceda a la textura especificada en el paso anterior y muestrelo utilizando el "valor" propiedad.
  • En el siguiente paso, adjunte un evento "texto"A los visitados"área de texto" utilizando el "addEventListener ()"Método y aplicarlo a la función"textareAsAValue ()". El "evento"En su argumento, pasa información sobre el evento que se activa.
  • Esto dará como resultado registrar cada uno de los valores de texto ingresados ​​uno al lado del otro.

Producción

De la salida anterior, el "atractivo"De cada uno de los valores de texto ingresados ​​se puede observar.

Enfoque 3: Obtener valor de área de texto en JavaScript usando jQuery

"jQuery"Se puede aplicar para acceder al campo de texto de entrada y activar sus funcionalidades tan pronto como se cargue el modelo de objeto de documento (DOM).

Ejemplo
Sigamos el ejemplo de abajo dados:


Escribe algo:

En las líneas de código anteriores, realice los siguientes pasos:

  • Incluya la biblioteca jQuery para aplicar sus métodos.
  • Especifica el "aporte"Como campo de texto con los valores especificados de"identificación" y "marcador de posición"Como se discutió antes.
  • Además, cree un botón para obtener el valor en el botón Haga clic.

Pase a la parte JavaScript del código:

Sigue los pasos establecidos:

  • Aplica el "listo()"Método para aplicar los métodos adicionales sobre el DOM cargado.
  • Acceda al botón creado y adjunte el "hacer clic()"Método que ejecutará la función establecida en su parámetro.
  • El método Click () accederá al campo de texto de entrada especificado e registrará el valor de texto ingresado en la consola.

Producción

Por lo tanto, el valor del tipo se registra en la consola.

Estas fueron todas las diferentes formas de obtener el valor del área de texto con la ayuda de JavaScript.

Conclusión

El "getElementById ()"Método, el"addEventListener ()"Método o el"jQuery"Se puede utilizar para obtener el valor del área de texto en JavaScript. El método getElementById () se puede implementar para acceder al campo de texto de entrada y mostrar el valor del área de texto ingresado a través de la alerta. El método addEventListener () se puede utilizar para adjuntar un "aporte"Evento que obtendrá el valor de texto en cada entrada lado a lado. La jQuery se puede aplicar para acceder al botón directamente y recuperar el valor de texto ingresado en el botón Haga clic en la consola. Este tutorial explica cómo obtener el valor del área de texto en JavaScript.