Comment supprimer des styles dans jquery-js tutoriel-php.cn

Comment supprimer des styles dans jquery

青灯夜游

Libérer： 2021-11-23 19:16:24

original

5262 Les gens l'ont consulté

Méthode de suppression : 1. Utilisez la méthode RemoveAttr(), la syntaxe est "$(element).removeAttr("Attribute name")", le nom de l'attribut peut être id, class ou style 2. Utilisez RemoveClass() ; méthode, la syntaxe est "$ (element).removeClass("classname")".

Comment supprimer des styles dans jquery

L'environnement d'exploitation de ce tutoriel : système Windows 7, jquery version 1.10.2, ordinateur Dell G3.

Méthode jquery pour supprimer les styles

Méthode 1 : utilisez la méthode removeAttr()

removeAttr() pour supprimer les attributs des éléments sélectionnés.

<!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() {
					$("h1").removeAttr("id");
					$("p").removeAttr("style");
					$("p").removeAttr("class");
				});
			});
		</script>
		<style>
			#h1{
				color: red;
			}
			.box{
				color: #FFC0CB;
			}
		</style>
	</head>

	<body>
		<h1 id="h1">这是一个标题</h1>
		<p style="font-size:120%;color:red">这是一个段落。</p>
		<p class="box">这是另一个段落。</p>
		<button>删除样式</button>
	</body>
</html>

Copier après la connexion

Rendu :

Comment supprimer des styles dans jquery

Méthode 2 : Utilisez la méthode removeClass()

removeClass() pour supprimer une ou plusieurs classes de l'élément sélectionné.

Remarque : Si aucun paramètre n'est spécifié, cette méthode supprimera toutes les classes des éléments sélectionnés.

<!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").removeClass();
					$("div").removeClass("intro");
				});
			});
		</script>
		<style>
			.box1 {
				color: #FFC0CB;
			}

			.box2 {
				color: #FFC0CB;
			}

			.box3 {
				color: #FFC0CB;
			}

			.intro {
				font-size: 120%;
				color: red;
			}
		</style>
	</head>

	<body>
		<p class="box1">这是一个段落。</p>
		<p class="box2">这是一个段落。</p>
		<p class="box3">这是一个段落。</p>
		<div class="intro">这是另一个段落。</div><br>
		<button>删除样式</button>
	</body>
</html>

Copier après la connexion

Comment supprimer des styles dans jquery