jQuery
Les attributs
Recherche…
Remarques
La fonction jQuery .attr() , obtient la valeur d'un attribut pour le premier élément de l'ensemble des éléments correspondants ou définit un ou plusieurs attributs pour chaque élément correspondant.
Il convient de noter que lorsqu’on obtient la valeur d’un attribut, il ne l’obtient que du premier élément qui correspond au sélecteur (c.- $("input").attr("type"); d. $("input").attr("type"); , s'il y en a plus d'un
Cependant, lors de la définition d'un attribut, il sera appliqué à tous les éléments correspondants.
Récupère la valeur d'attribut d'un élément HTML
Lorsqu'un seul paramètre est passé à la fonction .attr() , il renvoie la valeur de l'attribut transmis sur l'élément sélectionné.
Syntaxe:
$([selector]).attr([attribute name]);
Exemple:
HTML:
<a href="/home">Home</a>
jQuery:
$('a').attr('href');
Récupération data attributs de data :
jQuery propose la fonction .data() pour gérer les attributs de données. .data fonction .data renvoie la valeur de l'attribut data sur l'élément sélectionné.
Syntaxe:
$([selector]).data([attribute name]);
Exemple:
Html:
<article data-column="3"></article>
jQuery:
$("article").data("column")
Remarque:
La méthode data () de jQuery vous donnera accès aux attributs data- *, MAIS, elle interrompt la casse du nom de l'attribut. Référence
Valeur de réglage de l'attribut HTML
Si vous souhaitez ajouter un attribut à un élément, vous pouvez utiliser la fonction attr(attributeName, attributeValue) . Par exemple:
$('a').attr('title', 'Click me');
Cet exemple ajoute le texte "Click me" au passage de la souris à tous les liens de la page.
La même fonction est utilisée pour modifier les valeurs des attributs.
Supprimer l'attribut
Pour supprimer un attribut d'un élément, vous pouvez utiliser la fonction .removeAttr(attributeName) . Par exemple:
$('#home').removeAttr('title');
Cela supprimera l'attribut title de l'élément avec ID home .
Differece entre attr () et prop ()
attr() obtient / définit l'attribut HTML à l'aide des fonctions DOM getAttribute() et setAttribute() . prop() fonctionne en définissant la propriété DOM sans modifier l'attribut. Dans de nombreux cas, les deux sont interchangeables, mais il en faut parfois un sur l'autre.
Pour définir une case à cocher comme cochée:
$('#tosAccept').prop('checked', true); // using attr() won't work properly here
Pour supprimer une propriété, vous pouvez utiliser la méthode removeProp() . De même, removeAttr() supprime les attributs.