différence entre prop() et attr() en jQuery et quand utiliser attr() et prop() [en double]
cette question a déjà une réponse ici:
j'ai vu à certains endroits .attr () est utilisé en jQuery.À certains endroits .prop() est utilisé.Mais j'ai cherché dans SO et google je suis très confus .S'il vous plaît dites-moi la différence exacte entre ces deux et quand les utiliser.
j'ai vu les liens suivants jQuery attr vs. prop, il y a une liste d'accessoires? jQuery attr vs prop?
Mais je n'ai pas eu la réponse.S'il vous plaît aider moi.Merci à l'avance.
avant de donner un downvote s'il vous plaît expliquer la raison, alors je vais corriger dans mon prochain post.
3 réponses
de docs
la différence entre les attributs et les propriétés peut être importante dans des situations spécifiques. Avant jQuery 1.6, le .la méthode attr () prend parfois en compte les valeurs des propriétés lors de la récupération de certains attributs, ce qui peut causer un comportement incohérent. Comme de jQuery 1.6, l' .la méthode prop () fournit un moyen de récupérer explicitement les valeurs des propriétés, while .attr() récupère les attributs.
exemple
par exemple, selectedIndex, tagName, nodeName, nodeType, ownerDocument, defaultChecked, et defaultSelected devraient être récupérés et mis avec le .prop() la méthode. Avant jQuery 1.6, ces propriétés étaient récupérables avec le .méthode attr (), mais cela ne faisait pas partie du champ d'application de la méthode attr. Ces n'ont pas d'attributs correspondants et sont uniquement les propriétés.
mis à jour après le commentaire
vous pouvez définir un attribut pour L'élément HTML. Vous le définissez en écrivant le code source, Une fois que le navigateur analyse votre code, noeud DOM correspondant sera créé qui est un objet ayant donc des propriétés.
exemple Simple peut être..
<input type="test" value="test" id="test" />
Ici type, la valeur de l'id de sont des attributs.Une fois que le navigateur l'aura rendu, vous obtiendrez d'autres propriétés comme align, alt, autofocus, baseURI, coché et ainsi de suite.
link si vous souhaitez en savoir plus sur ce
.attr() change les attributs pour cette balise HTML.
.prop() change les propriétés pour cette balise HTML selon le DOM tree.
comme le suggère l'exemple de ce lien. Un champ input peut avoir l'attribut "value". Ce sera égale à la valeur par défaut que vous avez entré. Si l'utilisateur change la valeur dans le champ input, la propriété "value" change dans L'arbre DOM, mais l'attribut original reste.
So en gros, si vous voulez que la valeur par défaut soit définie pour l'attribut D'une balise HTML, utilisez la fonction .attr() . Si cette valeur peut être modifiée par l'utilisateur (entrées, cases à cocher, radios, etc.)) utilisez la fonction .prop() pour obtenir la valeur la plus récente.
référence: HTML: la différence entre l'attribut et la propriété
Exemple
$(document).ready(function() {
console.log($('#test').attr('value') + " - With .attr()");
$('#answer').click(function() {
console.log($('#test').attr('value') + " - With .attr()");
console.log($('#test').prop('value') + " - With .prop()");
});
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div>Change the input value and check the console...</div>
<input type="text" id="test" value="Sample">
<button id="answer">Click Me</button>jQuery est une bibliothèque changeante et parfois ils font des améliorations régulières. .attr() est utilisée pour obtenir les attributs des balises HTML, et alors qu'il est parfaitement fonctionnel .prop() a été ajouté plus tard pour être plus sémantique et fonctionne mieux avec des attributs sans valeur comme "vérifié" et "sélectionné".
il est conseillé d'utiliser une version ultérieure de JQuery .prop() chaque fois que possible.