recherche

Maison >interface Web >js tutoriel >Explication détaillée des similitudes et des différences dans l'utilisation de attr(), prop(), val() pour obtenir une valeur dans jQuery

Explication détaillée des similitudes et des différences dans l'utilisation de attr(), prop(), val() pour obtenir une valeur dans jQuery

小云云
小云云original
2018-01-17 11:26:301988parcourir

Cet article vous apporte principalement une discussion détaillée des similitudes et des différences liées à l'utilisation de attr(), prop(), val() dans jQuery pour obtenir une valeur. L'éditeur le trouve plutôt bon, je vais donc le partager avec vous maintenant et le donner comme référence pour tout le monde. Suivons l'éditeur et jetons un œil. J'espère que cela pourra aider tout le monde.

Il existe trois fonctions dans jQuery qui sont similaires pour obtenir la valeur d'un élément : attr(), prop(), val();

Exemple de code : 


<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title></title>
  <script src="jquery-2.1.4.js"></script>

</head>
<body>
<input type="text" value="123"/>
<button id="btn">click</button>
<script>

  $("#btn").click(function(){
    var attr=$("input").attr("value");
    var prop=$("input").prop("value");
    var val=$("input").val();
    console.log(attr);
    console.log(prop);
    console.log(val);
  })
</script>
</body>

Le code est tel qu'indiqué ci-dessus, défini pour l'entrée boîte Valeur initiale : 123. Cliquez sur le bouton à ce moment, et la sortie de la console est : 


123
123
123

Modifiez la valeur de la zone de saisie, et la la sortie de la console est : 　


123
123thgf
123thgf

Si nous ne définissons pas de valeur initiale pour la zone de texte, c'est-à-dire après avoir supprimé value="123", et toujours en utilisant le code js ci-dessus, la sortie correspondante est la suivante :

undefined

la sortie attr() n'est pas définie, tandis que la sortie prop() et val() est "vide".

Après avoir entré la valeur value : la sortie de la console est : 


undefined
asdasd
asdasd

la sortie attr() est toujours indéfinie, tandis que prop() et val() affiche la valeur réelle.

On peut voir que prop() et val() peuvent obtenir la valeur réelle de la zone de texte, tandis que attr() obtient toujours la valeur d'attribut de value dans la structure du document, qui est différente de la zone de texte. La valeur réelle n’a pas d’importance et ne change pas.

Recommandations associées :

La différence entre .attr() et .data() dans jQuery

attr( ) et prop()

méthodes jQuery .attr() et .removeAttr() exemple d'élément opérationnel attributs_jquery

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration：
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Article précédent：jQuery réalise l'effet de prévisualisation de la grande image lorsque la souris glisse dessusArticle suivant：jQuery réalise l'effet de prévisualisation de la grande image lorsque la souris glisse dessus

Articles Liés

Voir plus