Comment effacer les attributs de style en ligne dans jquery-Questions et réponses frontales-php.cn

Comment effacer les attributs de style en ligne dans jquery

青灯夜游

Libérer： 2022-08-15 17:36:57

original

1725 Les gens l'ont consulté

Deux méthodes d'effacement : 1. Utilisez RemoveAttr() pour supprimer l'attribut de style de l'élément correspondant. Il vous suffit de définir la valeur du paramètre de la fonction sur "style". La syntaxe est "specify element.removeAttr("style"). )" . 2. Utilisez attr() pour définir la valeur de l'attribut style sur vide. Il vous suffit de définir la valeur du premier paramètre de la fonction sur "style" et la valeur du deuxième paramètre sur une chaîne vide. spécifie Element.attr("style","")".

Comment effacer les attributs de style en ligne dans jquery

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

Les attributs de style en ligne de HTML sont tous écrits dans l'attribut style.

En d'autres termes, en contrôlant la valeur de l'attribut style, vous pouvez contrôler le style en ligne.

Donc, utiliser une requête pour effacer l'attribut de style en ligne consiste à supprimer l'attribut de style ou à définir la valeur de l'attribut de style sur un caractère vide.

Deux façons d'effacer les attributs de style en ligne CSS avec jquery

Méthode 1 : utilisez RemoveAttr() pour supprimer l'attribut de style

removeAttr() peut supprimer l'attribut spécifié de tous les éléments correspondants.

$(selector).removeAttr(attribute)

Copier après la connexion

attribut : obligatoire. Spécifie les attributs à supprimer de l'élément spécifié.

Définissez simplement le paramètre d'attribut sur style.

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<script src="js/jquery-3.6.0.min.js"></script>
		<script>
			$(function() {
				$("button").click(function() {
					$("ul").removeAttr("style");
				})
			})
		</script>
	</head>
	<body>
		<ul style="border: 1px solid red;color:red;">
			<li>香蕉</li>
			<li>苹果</li>
			<li>梨子</li>
			<li>橘子</li>
		</ul>
		<button>ul移除行内样式</button>
	</body>
</html>

Copier après la connexion

Comment effacer les attributs de style en ligne dans jquery

Méthode 2 : Utilisez attr() pour définir la valeur de l'attribut de style sur vide

La méthode attr() peut définir les attributs et les valeurs de l'élément sélectionné.

$(selector).attr(attribute,value)

Copier après la connexion

parameter	description
attribute	spécifie le nom de l'attribut.
value	Spécifie la valeur de l'attribut.

Réglez simplement le premier paramètre de la fonction sur style，第二个参数设置为空字符串''.

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<script src="js/jquery-3.6.0.min.js"></script>
		<script>
			$(function() {
				$("button").click(function() {
					$("ul").attr("style","");
				})
			})
		</script>
	</head>
	<body>
		<ul style="border: 1px solid red;color:red;">
			<li>香蕉</li>
			<li>苹果</li>
			<li>梨子</li>
			<li>橘子</li>
		</ul>
		<button>ul移除行内样式</button>
	</body>
</html>

Copier après la connexion

Comment effacer les attributs de style en ligne dans jquery