Discussion détaillée sur la manipulation par jQuery des attributs des éléments DOM attr() et removeAtrr() méthodes

Comment manipuler les attributs d'un élément dans jQuery :
attr() : lit ou écrit la valeur d'attribut de l'élément correspondant.
removeAttr() : supprime l'attribut spécifié de l'élément correspondant.

Opération de lecture de la méthode attr()

　Opération de lecture attr(). Ce qui est lu est la valeur d'attribut spécifiée du premier élément dans l'élément correspondant.
Format : .attr(attributeName), type de valeur de retour : String La lecture d'un attribut inexistant renverra undéfini.

Notez que le résultat de la sélection du sélecteur peut être un ensemble, et ici seule la valeur d'attribut du premier élément de l'ensemble est obtenue
. Regardez l'exemple :

Copier le code Le code est le suivant :

paragraphe 1

paragraphe 2

obtenir le titre

Résultats en cours d'exécution : la boîte contextuelle affiche : titre 1.

Si vous souhaitez obtenir les attributs de chaque élément séparément, vous devez utiliser la structure de boucle de jQuery, telle que la méthode .each() ou .map().
L'exemple ci-dessus peut être modifié en :

Copier le code Le code est le suivant :

Vous pouvez obtenir les attributs de chaque élément séparément

opération d'écriture de la méthode attr()

　opération d'écriture attr(). Attribue une valeur à un ou plusieurs attributs de l'élément correspondant.
Format général : .attr(attributeName, value), qui consiste à définir la valeur de l'attribut.
Type de valeur de retour : jQuery. Il prend également en charge les appels de méthode en chaîne
.
Lors de l'exécution d'une opération d'écriture, si le nom d'attribut spécifié n'existe pas, un attribut portant ce nom sera ajouté, c'est-à-dire qu'un attribut personnalisé sera ajouté. Son nom est nom d'attribut et sa valeur est valeur
.
L'écriture des attributs est effectuée pour correspondre à chaque élément de la collection, voir exemple :

Copier le code Le code est le suivant :

Ceci est un paragraphe.

Ceci est un div.

Ceci est un autre paragraphe.

Ceci est un autre div.

Après avoir cliqué sur le bouton, tous les p sont ajoutés avec l'attribut title="Hello World".

Il existe deux autres formats pour les opérations d'écriture :
　.attr(attributs) et .attr(attributeName, function).
Les éléments suivants sont présentés séparément.

.attr(attributs):

Le type d'attribut ici est PlainObject, qui peut être utilisé pour définir plusieurs attributs à la fois
. Qu'est-ce que PlainObject ? Une compréhension simple est une séquence de paires clé-valeur entourées d'accolades. Vous pouvez vous référer au lien à la fin de la question pour obtenir des instructions. Les clés et les valeurs sont séparées par des deux-points (:) et chaque paire clé-valeur est séparée par des virgules (,
).
Remarque : Lors de la définition de plusieurs valeurs d'attribut, les guillemets du nom de l'attribut sont facultatifs (ils peuvent ou non être présents). Cependant, l'attribut de classe est une exception et doit être placé entre guillemets
.
Exemple :

Copier le code Le code est le suivant :

Ceci est un paragraphe.

Ceci est un div.

Ceci est un autre paragraphe.

Ceci est un autre div.

Après avoir cliqué sur les deux boutons, l'élément se transforme en :

Parmi eux, bonjour dans

se trouve un nouvel attribut personnalisé dont la valeur est World.

.attr(attributeName, function(index, oldValue)):
Utilisez une fonction pour définir la valeur de l'attribut. Le premier paramètre de la fonction est l'index et le deuxième paramètre est la valeur précédente de l'attribut
. Regardez l'exemple :

Copier le code Le code est le suivant :

Zéro-th 

Premier 

Deuxième 

　　上面的例子,对应的页面结果如下 :

　　La fonction set est définie par la fonction set, la fonction set est non définie, la fonction set est indéfinie et la fonction est non définie.被改变的.
　　即操作会被忽略.
　　Il s'agit de la fonction attr() qui est non définie :
　　如下 :

复制代码代码如下 :

　　返回的页面效果如下 :

　　即没有进行任何修改操作,还是保持原来的属性值.

　　注意:jQuery不能修改和

Étiquettes associées：

jquery

source：php.cn

Article précédent：Notes d'étude JavaScript : Fonction Object_Basic Knowledge Article suivant：Résumé des connaissances de base d'Angularjs et exemples_AngularJS

Déclaration de ce site Web

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

Derniers articles par auteur