jquery如何添加類和移除類

發(fā)布時(shí)間：2022-11-23 09:35:20 來(lái)源：億速云閱讀：105 作者：iii 欄目：web開(kāi)發(fā)

這篇文章主要講解了“jquery如何添加類和移除類”，文中的講解內(nèi)容簡(jiǎn)單清晰，易于學(xué)習(xí)與理解，下面請(qǐng)大家跟著小編的思路慢慢深入，一起來(lái)研究和學(xué)習(xí)“jquery如何添加類和移除類”吧！

jquery中可用addClass()和removeClass()來(lái)添加類和移除類。addClass()向被選元素添加一個(gè)或多個(gè)類，語(yǔ)法“$(selector).addClass(類名)”，如需添加多個(gè)類，就使用空格分隔類名。removeClass()從被選元素移除一個(gè)或多個(gè)類，語(yǔ)法“$(selector).removeClass(類名)”；參數(shù)可以省略，此時(shí)就會(huì)清空所有類。

jquery添加類和移除類的方法

方法	描述
addClass()	向匹配的元素添加指定的類名。
removeClass()	從所有匹配的元素中刪除全部或者指定的類。

jquery addClass()添加類

addClass() 方法向被選元素添加一個(gè)或多個(gè)類。

該方法不會(huì)移除已存在的 class 屬性，僅僅添加一個(gè)或多個(gè) class 屬性。

提示：如需添加多個(gè)類，請(qǐng)使用空格分隔類名。

語(yǔ)法：

$(selector).addClass(class)

參數(shù)	描述
class	必需。規(guī)定一個(gè)或多個(gè) class 名稱。

示例：向第一個(gè) p 元素添加一個(gè)類

<!DOCTYPE html>
<html>
	<head>
		<script src="js/jquery-3.6.1.min.js"></script>
		<script type="text/javascript">
			$(document).ready(function() {
				$("button").click(function() {
					$("p:first").addClass("intro");
				});
			});
		</script>
		<style type="text/css">
			.intro {
				font-size: 120%;
				color: red;
			}
		</style>
	</head>

	<body>
		<h2>This is a heading</h2>
		<p>This is a paragraph.</p>
		<p>This is another paragraph.</p>
		<button>向第一個(gè) p 元素添加一個(gè)類</button>
	</body>
</html>

jquery如何添加類和移除類

jQuery removeClass()移除類

removeClass() 方法從被選元素移除一個(gè)或多個(gè)類。

注釋：如果沒(méi)有規(guī)定參數(shù)，則該方法將從被選元素中刪除所有類。

語(yǔ)法：

$(selector).removeClass(class)

參數(shù)	描述
class	可選。規(guī)定要移除的 class 的名稱。如需移除若干類，請(qǐng)使用空格來(lái)分隔類名。如果不設(shè)置該參數(shù)，則會(huì)移除所有類。

參數(shù)

描述

class

可選。規(guī)定要移除的 class 的名稱。

如需移除若干類，請(qǐng)使用空格來(lái)分隔類名。

如果不設(shè)置該參數(shù)，則會(huì)移除所有類。

示例：移除所有 <p> 的 "intro" 類

<!DOCTYPE html>
<html>
	<head>
		<script src="js/jquery-3.6.1.min.js"></script>
		<script type="text/javascript">
			$(document).ready(function() {
				$("button").click(function() {
					$("p").removeClass("intro");
				});
			});
		</script>
		<style type="text/css">
			.intro {
				font-size: 120%;
				color: red;
			}
		</style>
	</head>

	<body>
		<h2 id="h2">This is a heading</h2>
		<p class="intro">This is a paragraph.</p>
		<p>This is another paragraph.</p>
		<button>從第一個(gè)段落中刪除類</button>
	</body>
</html>

jquery如何添加類和移除類

感謝各位的閱讀，以上就是“jquery如何添加類和移除類”的內(nèi)容了，經(jīng)過(guò)本文的學(xué)習(xí)后，相信大家對(duì)jquery如何添加類和移除類這一問(wèn)題有了更深刻的體會(huì)，具體使用情況還需要大家實(shí)踐驗(yàn)證。這里是億速云，小編將為大家推送更多相關(guān)知識(shí)點(diǎn)的文章，歡迎關(guān)注！

向AI問(wèn)一下細(xì)節(jié)

jquery如何添加類和移除類

猜你喜歡

最新資訊

相關(guān)推薦

相關(guān)標(biāo)簽