Obtenez la valeur de l'élément à l'aide de JavaScript

Parfois, les programmeurs veulent modifier la valeur de n'importe quel élément, ils ont donc besoin d'abord d'obtenir l'élément, puis de vérifier la valeur de l'élément spécifié. Après cela, appliquez les opérations à eux. Pour obtenir la référence de l'élément et sa valeur, JavaScript offre certaines méthodes ou propriétés prédéfinies.

Ce tutoriel expliquera comment obtenir la valeur d'un élément à l'aide de JavaScript.

Comment obtenir la valeur des éléments à l'aide de JavaScript?

Pour obtenir la valeur d'un élément HTML, utilisez le «valeur»Propriété de l'interface Htmldataelement.

Pour obtenir une référence de l'élément, plusieurs méthodes sont utilisées

• Méthode GetElementById ()
• Méthode GetElementByClass ()
• Méthode GetElementByTagName ()
• Méthode QueySelector ()
• Méthode QueySelectorall ()

Ici, les méthodes les plus couramment utilisées avec le «valeur«La propriété sera discutée.

Exemple 1: Obtenez la valeur de l'élément à l'aide de la propriété de valeur avec getElementById ()

Pour obtenir la valeur de l'élément, utilisez le «valeur»Propriété avec le«getElementByid ()«Méthode pour obtenir la référence de l'élément à l'aide de son attribution«identifiant".

Tout d'abord, créez un formulaire dans le fichier HTML, avec un champ de saisie et un bouton qui affichera la valeur entrée dans le champ de texte sur le "Cliquez sur" événement:

Obtenir la valeur du champ de saisie

Suivez les lignes de code ci-dessous:

fonction getElementValue ()
VAR VALLE = DOCUMENT.getElementByid ("texte").valeur;
alerte (valeur);

Dans l'extrait de code ci-dessus:

• Tout d'abord, définissez une fonction "getElementValue ()".
• Ensuite, récupérez l'élément avec son identifiant "texte»Et récupérez sa valeur en utilisant le«valeur«Propriété et stockez-le dans une variable»valeur".
• Enfin, montrez la valeur de l'élément dans un message d'alerte.

Sortir

La sortie ci-dessus indique que la valeur de l'élément est récupérée avec succès à l'aide de la propriété de valeur avec la méthode GetElementById ().

Comment obtenir la référence de l'élément sans aucun identifiant spécifié? Suivez la section ci-dessous.

Exemple 2: Obtenez la valeur de l'élément à l'aide de la propriété de valeur avec la méthode QueySelector ()

Une autre façon d'obtenir une référence à un élément pour obtenir sa valeur est d'utiliser le «QuerySelector ()" méthode. Il faut un «sélecteur"Du nom d'un élément comme argument et donne le premier élément du document qui correspond au sélecteur donné.

Ici, tout d'abord, créez un menu déroulant en utilisant le Tag, et un bouton qui déclenchera le "getElementValue ()”Fonction pour obtenir la valeur de l'option sélectionnée:

Sélectionnez la langue que vous souhaitez apprendre:

Html
CSS
Javascrip
Java
Python



Obtenir la valeur du champ de saisie

Dans le fichier JavaScript, utilisez le code suivant:

fonction getElementValue ()
VAR VALLE = DOCUMENT.QuerySelector ("SELECT").valeur;
alerte (valeur);

Dans les lignes de code ci-dessus:

• Définir une fonction "getElementValue ()".
• Ensuite, appelez le «QuerySelector ()"Méthode en passant un sélecteur"sélectionner”Élément avec le"valeur»Propriété, cela obtient la valeur sélectionnée du menu déroulant.
• Enfin, affichez la valeur sélectionnée de l'élément dans un message d'alerte.

La sortie affiche les valeurs sélectionnées dans un message d'alerte:

Conclusion

Pour obtenir la valeur de l'élément du DOM, utilisez le «valeur”Propriété de l'interface htmldataelement avec différentes méthodes pour obtenir une référence de l'élément, comme«getElementByid ()" méthode, "getElementByClass ()«Méthode, ou le«QuerySelector ()" méthode. Ce tutoriel a expliqué la procédure pour obtenir la valeur de l'élément à l'aide de JavaScript.