jquery如何刪除樣式

發(fā)布時間：2021-11-22 11:06:10 來源：億速云閱讀：207 作者：iii 欄目：web開發(fā)

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

刪除方法：1、用removeAttr()方法，語法“$(元素).removeAttr("屬性名")”，屬性名可為id、class或style；2、用removeClass()方法，語法“$(元素).removeClass("類名")”。

jquery如何刪除樣式

本教程操作環(huán)境：windows7系統(tǒng)、jquery1.10.2版本、Dell G3電腦。

jquery刪除樣式的方法

方法1：利用removeAttr()方法

removeAttr() 方法可從被選元素中移除屬性。

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

	<body>
		<h2 id="h2">這是一個標(biāo)題</h2>
		<p style="font-size:120%;color:red">這是一個段落。</p>
		<p class="box">這是另一個段落。</p>
		<button>刪除樣式</button>
	</body>
</html>

效果圖：

jquery如何刪除樣式

方法2：利用removeClass()方法

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

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

<!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>

jquery如何刪除樣式

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

向AI問一下細節(jié)

jquery如何刪除樣式

猜你喜歡

最新資訊

相關(guān)推薦

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