Comment obtenir une valeur d'entrée en javascript

JavaScript offre une variété de fonctionnalités pour créer des interfaces interactives. On peut récupérer la valeur de n'importe quel élément à l'aide de méthodes JavaScript. La valeur d'entrée peut être imprimée quelque part sur la page Web ou elle peut être obtenue sous forme de message d'alerte. Tout cela est possible avec l'aide de JavaScript. Ici, nous décrirons le Javascrip Prise en charge pour obtenir la valeur d'entrée de n'importe quel élément. Les résultats d'apprentissage suivants sont attendus:

• Comment obtenir une valeur d'entrée en javascript
• Obtenez la valeur d'entrée à l'aide de la méthode GetElementById ()
• Obtenez la valeur d'entrée à l'aide de la méthode GetElementsByClassName ()
• Obtenez la valeur d'entrée à l'aide de la méthode QueySelector ()

Comment obtenir une valeur d'entrée en javascript

JavaScript fournit deux propriétés pour obtenir les valeurs d'entrée en utilisant le getElementbyid, getElementsByClassName, et querysecteur méthodes. Ces méthodes extraient la chaîne ainsi que la valeur numérique pour afficher les informations utilisateur. Tous les navigateurs célèbres prennent en charge ces deux propriétés. Le valeur la propriété renvoie les informations de l'utilisateur. De plus, la propriété est utile pour attribuer une valeur spécifique pour l'affichage dans la fenêtre du navigateur.

La syntaxe de ces méthodes est indiquée ci-dessous.

Syntaxe de GetElementByid

document.getElementByid ("textid").Value = "Text_Message";

Syntaxe de GetElementsByClassName

document.getElementsByClassName ("clname").valeur ;

Syntaxe de Queryselector

document.queySelector ("id1").valeur

La description des paramètres ci-dessus est comme ci-dessous:

• textide: indique l'ID d'un élément.
• message texte: représente le message à afficher.
• Clname: Spécifiez le nom de la classe.
• ID1: représente l'ID ou la classe d'un élément HTML.

Exemple 1: Obtenez la valeur d'entrée à l'aide de la méthode GetElementById ()

Un autre exemple est pris en compte pour obtenir la valeur d'entrée en javascript.

Html

Un exemple pour obtenir la valeur du champ de texte

Message préféré:

Appuyez sur le bouton pour afficher la valeur du texte.

Bouton d'affichage

Le code HTML obtient la valeur d'entrée "Bienvenue à JavaScript"En appuyant sur le"Bouton d'affichage". Le bouton est attaché avec le Display_fn () méthode.

Javascrip

fonction affiche_fn ()
var a = document.getElementByid ("mtxt").valeur;
document.getElementByid ("démo").innerHtml = a;

Une méthode Display_fn () est utilisé pour récupérer la valeur du texte dans le fichier html par getElementbyid.

Exemple 2: Obtenez la valeur d'entrée à l'aide de la méthode GetElementsByClassName ()

Un exemple est considéré pour obtenir la valeur numérique du champ de saisie en JavaScript.

Fichier html

Un exemple pour obtenir la valeur numérique du champ

Obtenir une valeur numérique

Dans ce code, la description est comme ci-dessous:

• La classe INPCLS est utilisé pour saisir le numéro numérique.
• Après cela, un bouton est attaché qui est associé au getInpval () méthode.
• En fin de compte, un fichier javascript test.js est lié en attribuant la source SRC variable.

Javascrip

fonction getInpval ()
LET INPVAL = DOCUMENT.getElementsByClassName ("inpcls") [0].valeur;
alerte (inpval);

Dans le fichier JavaScript:

• Une méthode getInpval () est utilisé pour extraire la valeur du Html déposer.
• L'extraction est réalisée par getelementByClassName («inPcls») [0].valeur.
• En fin de compte, un message d'alerte est généré en passant le inpval variable.

Sortir

La sortie montre que l'utilisateur saisit d'abord n'importe quel nombre. Après cela, une boîte à alerte est générée en appuyant sur le «Obtenir une valeur numérique" bouton.

Exemple 3: Obtenez la valeur d'entrée à l'aide de la méthode QueySelector ()

Un autre exemple est considéré pour obtenir la valeur en utilisant le QuerySelector () méthode.

Code

Obtenez de la valeur à l'aide du sélecteur de requête

Bouton d'affichage

Dans ce code, la description est la suivante:

• Premièrement, un zone de texte et un bouton sont attachés avec et Tags respectivement.
• Le bouton est associé au getValueInput () méthode.
• Dans cette méthode, QuerySelector () est employé pour extraire la valeur du zone de texte et l'afficher en utilisant Val1.

Sortir

La sortie montre le message "Javascrip”En appuyant sur le bouton dans le navigateur.

Conclusion

Le getElementbyid, getElementsByClassName, et QuerySelector () Les méthodes sont utilisées pour obtenir la valeur d'entrée en JavaScript. Les deux premières méthodes récupèrent les éléments en utilisant l'ID et le nom de la classe. Tandis que la troisième méthode peut obtenir les éléments en utilisant un ID ainsi qu'un nom de classe. Ici, vous avez appris à utiliser ces trois méthodes pour obtenir des valeurs d'entrée en JavaScript.