La nouvelle version de jQuery a apporté quelques changements intéressants au module Attributes.
Je vais essayer de détailler les changements dans ce billet.
Premièrement, utiliser .attr() sur les objets document et window ne fonctionnera pas. Par respect du DOM, ceux-ci ne peuvent pas avoir d'attributs, il est donc normal que jQuery suive cette règle au plus près. Ils contiennent cependant des propriétés qui elles peuvent donc être manipulées grâce à .prop().
Avec jQuery 1.6, vous aurez une exception si vous tentez d'utiliser .attr() sur ces objets. Avec 1.6.1, .attr() vous renverra le résultat de .prop(). Ah oui, au fait, jQuery 1.6.1 est disponible mais je vous en reparle lundi 
Les booléens tels que checked, selected ou encore disabled reçoivent un traitement spécial.
Le problème de définir un attribut pour ces booléens est que cela ne définit que la valeur initiale et non la valeur courante. Il faut donc utiliser .prop() pour être au plus juste. Vous pouvez faire ceci par exemple :
$(“:checkbox”).get(0).checked = true;
// Ou encore
$(":checkbox:first").prop(“checked”, true);
Mais vous ne pouvez pas faire ça :
$(“:checkbox”).attr(“checked”, true);
Vous ne feriez que modifier la valeur initiale de vos checkbox, sans intérêt et risque de vous faire tourner en rond. Avec jQuery 1.6.1, ce sera la propriété qui est modifiée mais maintenir cet usage n'est pas recommandé puisque ne correspond pas à la logique de jQuery et du DOM.
Pour info, voici la liste exhaustive des propriétés booléennes dont vous allez devoir prendre l'habitude d'utiliser .prop() pour les manipuler :
- autofocus
- autoplay
- async
- checked
- controls
- defer
- disabled
- hidden
- loop
- multiple
- open
- readonly
- required
- scoped
- selected
Et ici une correspondance un peu plus complète de ce qui peut être manipulé avec .attr() et avec .prop() ou avec les deux (mais recommandé avec .prop()) :
| Attribut/Propriété | .attr() | .prop() |
| accesskey | ✓ | |
| align | ✓ | |
| async | ✓ | ✓ |
| autofocus | ✓ | ✓ |
| checked | ✓ | ✓ |
| class | ✓ | |
| contenteditable | ✓ | |
| defaultValue | ✓ | |
| draggable | ✓ | |
| href | ✓ | |
| id | ✓ | |
| label | ✓ | |
| location | ✓ | ✓ |
| multiple | ✓ | ✓ |
| nodeName | ✓ | |
| nodeType | ✓ | |
| readOnly | ✓ | ✓ |
| rel | ✓ | |
| selected | ✓ | ✓ |
| selectedIndex | ✓ | |
| src | ✓ | |
| style | ✓ | |
| tabindex | ✓ | |
| tagName | ✓ | |
| title | ✓ | |
| type | ✓ | |
| width | ✓ |
Encore une fois, n'oubliez pas que si c'est coché pour les deux, il vaut quand même mieux utiliser .prop().
Voilà, à vos questions, si vous en avez
Sympa cet article.. C’est clair que ça risque de faire des modifs dans les codes, voire rendre incompatibles ou défectueux certains plugins.. urgh..
Croisons les doigts pour que JQueryUI ne soit pas trop impacté..
Il faudrait presque faire une recherche full-text de ‘attr(‘ dans les codes de plugins..
S.
Eh oui, on peut pas changer un src via prop() pour une image, mais via attr() .
Par contre, undeterminate , qui n’est jamais exploité en HTML, sans problème settable en prop
faut tout retester, si on veut faire evoluer son code.
Ah, merci de l’info. Je vais faire quelques tests et mettre à jour en conséquence l’article. Merci!