Comment ajouter une classe à un élément dans jquery-Questions et réponses frontales-php.cn

Comment ajouter une classe à un élément dans jquery

青灯夜游

Libérer： 2022-03-18 19:12:01

original

4668 Les gens l'ont consulté

Comment ajouter une classe à un élément dans jquery : 1. Utilisez la méthode attr(), la syntaxe "$(selector).attr("class","class name""); 2. Utilisez la méthode addClass(); méthode, la syntaxe "$( selector).addClass("class name")".

Comment ajouter une classe à un élément dans jquery

L'environnement d'exploitation de ce tutoriel : système windows7, version jquery1.10.2, ordinateur Dell G3.

Ajoutez une classe à l'élément dans jquery

1. Utilisez la méthode attr()

attr() pour définir ou renvoyer la valeur d'attribut de l'élément sélectionné.

Selon les différents paramètres de cette méthode, sa méthode de travail est également différente.

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<script src="js/jquery-1.10.2.min.js"></script>
		<script>
			$(document).ready(function() {
				$("button").click(function() {
					$("p:first").attr("class","intro");
				});
			});
		</script>
		<style>
			.intro {
				font-size: 150%;
				color: red;
			}
		</style>
	</head>
	<body>

		<h1>这是一个标题</h1>
		<p>这是一个段落。</p>
		<p>这是另一个段落。</p>
		<button>给第一个P元素添加一个类名</button>

	</body>
</html>

Copier après la connexion

Comment ajouter une classe à un élément dans jquery

2. Utilisez la méthode addClass()

addClass() pour ajouter un ou plusieurs noms de classe à l'élément sélectionné.

Cette méthode ne supprime pas l'attribut de classe existant, mais ajoute uniquement un ou plusieurs noms de classe à l'attribut de classe.

Conseils : Si vous devez ajouter plusieurs classes, veuillez utiliser des espaces pour séparer les noms de classe.

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<script src="js/jquery-1.10.2.min.js"></script>
		<script>
			$(document).ready(function() {
				$("button").click(function() {
					$("p:first").addClass("intro");
				});
			});
		</script>
		<style>
			.intro {
				font-size: 150%;
				color: pink;
			}
		</style>
	</head>
	<body>

		<h1>这是一个标题</h1>
		<p>这是一个段落。</p>
		<p>这是另一个段落。</p>
		<button>给第一个P元素添加一个类名</button>

	</body>
</html>

Copier après la connexion

Comment ajouter une classe à un élément dans jquery