jqueryでクラスをクリアする方法-フロントエンドQ&A-php.cn

jqueryでクラスをクリアする方法

青灯夜游

リリース： 2022-09-09 19:14:40

オリジナル

4170 人が閲覧しました

3 メソッド: 1. "element object.removeClass("クラス名")" を使用して、指定したクラスを削除します。指定されたパラメーターがない場合は、クラスをクリアできます。 2. "element object.removeClass("クラス名") を使用します。指定したクラスを削除するには、toggleClass("クラス名") ",false)"を使用します。 3. クラスをクリアするには、"element object.attr("class","")" を使用します。

jqueryでクラスをクリアする方法

このチュートリアルの動作環境: Windows7 システム、jquery1.10.2 バージョン、Dell G3 コンピューター。

#jquery でクラスをクリアする 3 つの方法

1. クラスを削除するには、removeClass() を使用します。

removeClass() メソッドは、選択した要素から 1 つ以上のクラスを削除します。

$(selector).removeClass(class)

ログイン後にコピー

注: パラメーターが指定されていない場合、このメソッドは選択した要素からすべてのクラスを削除します。

例: すべての

要素から「intro」クラスを削除します

<!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("intro");
				});
			});
		</script>
		<style type="text/css">
			.intro {
				font-size: 120%;
				color: red;
			}
		</style>
	</head>
	<body>

		<h1>这是一个标题</h1>
		<p class="intro">这是一个段落。</p>
		<p class="intro">这是另一个段落。</p>
		<button>移除所有P元素的"intro"类</button>

	</body>
</html>

ログイン後にコピー

jqueryでクラスをクリアする方法

#2. toggleClass() を使用してクラスを削除します

#toggleClass() メソッドは、選択した要素の 1 つ以上のクラスの追加と削除を切り替えます。

このメソッドは、各要素で指定されたクラスをチェックします。クラスが存在しない場合は追加し、設定されている場合は削除します。これをトグル効果と呼びます。

$(selector).toggleClass(class,switch)

ログイン後にコピー

ただし、「switch」パラメータを使用すると、クラスのみを削除または追加のみを指定できます。

スイッチ: オプションのパラメータ、ブール値は、クラスを追加のみするか (true)、削除するか (false) を指定します。

<!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").toggleClass("main",false);
				});
			});
		</script>
		<style>
			.main {
				font-size: 120%;
				color: red;
			}
		</style>
	</head>
	<body>

		<button>删除P元素的"main"类</button>
		<p class="main">这是一个段落。</p>
		<p class="main">这是另一个段落。</p>

	</body>
</html>

ログイン後にコピー

#3. attr() と prop() を使用してクラス属性の値を空に設定します jqueryでクラスをクリアする方法

attr() と prop() は両方とも指定された属性と値を設定できます。実行すると、class 属性の値を空に設定してクラスを削除します

$(document).ready(function() {
	$("button").click(function() {
		$("p").attr("class","");
		// $("p").prop("class","");
	});
});

ログイン後にコピー

#[推奨される学習:

jQuery ビデオチュートリアル
、Web フロントエンドビデオ
]
以上がjqueryでクラスをクリアする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。