Maison > Article > interface Web > Quelle est la méthode pour manipuler les attributs des éléments dans jquery ?
Quelle est la méthode pour manipuler les attributs des éléments dans jquery ?
- 青灯夜游original
- 2022-03-18 18:59:402533parcourir
Les méthodes pour faire fonctionner les attributs d'élément sont : 1. Les méthodes pour faire fonctionner les attributs de classe, y compris addClass(), hasClass(), removeClass(), toggleClass(); 2. Les méthodes pour faire fonctionner les attributs spécifiés, y compris attr(), prop(); ) ,supprimerAttr().
L'environnement d'exploitation de ce tutoriel : système windows7, version jquery1.12.4, ordinateur Dell G3.
Méthode d'opération d'attribut jQuery
| Méthode | Description |
|---|---|
| addClass() | Ajoute le nom de classe spécifié (valeur de l'attribut de classe) à l'élément correspondant. |
| attr() | Définissez ou renvoyez les attributs et les valeurs de l'élément correspondant. |
| prop() | Définissez ou renvoyez les propriétés et les valeurs de l'élément correspondant. |
| hasClass() | Vérifiez si l'élément correspondant a la classe spécifiée. |
| removeAttr() | Supprime l'attribut spécifié de tous les éléments correspondants. |
| removeClass() | Supprimez toutes les classes ou celles spécifiées de tous les éléments correspondants. |
| toggleClass() | Ajoutez ou supprimez une classe de l'élément correspondant. |
Les méthodes jQuery attr() et prop() renvoient ou définissent des attributs
La méthode prop() est similaire à la méthode attr(), les deux sont utilisées pour obtenir ou définir les attributs HTML du élément, mais les deux Il existe également des différences fondamentales.
Recommandation officielle de jQuery : pour les attributs avec deux valeurs true et false, tels que vérifié, sélectionné, désactivé, etc., il est recommandé d'utiliser la méthode prop() pour fonctionner, tandis que d'autres attributs sont recommandés pour utiliser la méthode attr() pour fonctionner.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script src="js/jquery-1.12.4.min.js"></script>
<script>
$(function () {
$('input[type="radio"]').change(function(){
var bool = $(this).attr("checked");
if(bool){
$("p").text("你选择的是：" + $(this).val());
}
})
})
</script>
</head>
<body>
<div>
<label><input type="radio" name="fruit" value="苹果" />苹果</label>
<label><input type="radio" name="fruit" value="香蕉" />香蕉</label>
<label><input type="radio" name="fruit" value="西瓜" />西瓜</label>
</div>
<p></p>
</body>
</html>
Dans cet exemple, nous voulons en fait utiliser $(this).attr("checked") pour déterminer si le bouton radio est sélectionné, et s'il est sélectionné, obtenir la valeur du bouton radio. Mais après avoir exécuté le code, j'ai trouvé : Cela n'a aucun effet ! Pourquoi est-ce ?
En fait, nous ne pouvons pas obtenir les attributs vérifiés, sélectionnés et désactivés de l'élément de formulaire en utilisant la méthode attr(), mais devons utiliser la méthode prop(). Par conséquent, cela fonctionnera si nous remplaçons la méthode attr() par la méthode prop().
En fait, la méthode prop() semble compenser les lacunes de la méthode attr() dans les opérations sur les attributs de formulaire. Rappelez-vous une phrase : si une propriété ne peut pas être obtenue ou définie à l'aide de la méthode attr(), elle peut être obtenue en modifiant la méthode prop().
La méthoderemoveAttr() supprime les attributs
Dans jQuery, nous pouvons utiliser la méthode removeAttr() pour supprimer un attribut d'un élément.
Syntaxe :
$().removeAttr("属性名")Opération de nom de classe jQuery
L'opération de nom de classe fait référence à l'ajout d'une classe à un élément ou à la suppression d'une classe, contrôlant ainsi globalement le style de l'élément.
Dans jQuery, il existe trois types d'opérations de nom de classe CSS.
Ajouter une classe.
Supprimer la classe.
Changer de classe.
Méthode addClass() pour ajouter une classe
Dans jQuery, nous pouvons utiliser la méthode addClass() pour ajouter une classe à un élément.
Syntaxe :
$().addClass("类名")méthoderemoveClass() pour supprimer une classe
Dans jQuery, nous pouvons utiliser la méthode removeClass() pour supprimer une classe pour un élément.
Syntaxe :
$().removeClass("类名")La méthode toggleClass() change de classe
Dans jQuery, nous pouvons utiliser la méthode toggleClass() pour changer les noms de classe des éléments. Toggle signifie en fait "switch". Nous serons souvent exposés à ce mot à l'avenir, comme toggle(), slideToggle(), etc. Les amis devraient faire attention et comparer.
Syntaxe : la méthode
$().toggleClass("类名")toggleClass() est utilisée pour vérifier si un élément a une certaine classe. Si la classe n'existe pas, la classe est ajoutée à l'élément ; si la classe existe déjà, la classe est supprimée de l'élément.
【Apprentissage recommandé : Tutoriel vidéo jQuery, web front-end】
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!