溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

jquery如何刪除除表頭外的其他行

發(fā)布時間:2022-05-27 14:13:30 來源:億速云 閱讀:461 作者:iii 欄目:web開發(fā)

這篇文章主要介紹“jquery如何刪除除表頭外的其他行”的相關知識,小編通過實際案例向大家展示操作過程,操作方法簡單快捷,實用性強,希望這篇“jquery如何刪除除表頭外的其他行”文章能幫助大家解決問題。

刪除方法:1、利用“:not()”和“:first”選擇器選取除表頭外的其他行,語法“$("tr:not(:first)")”,會返回一個包含元素的jq對象;2、用remove()刪除選取的全部元素,語法“被選元素對象.remove()”。

jquery如何刪除除表頭外的其他行

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

jquery刪除除表頭外的其他行的方法

在表格中,表頭指的是表格的第一行,即第一個tr元素的內容。

jquery刪除除表頭外的其他行,就是刪除除第一行外的tr元素。

好了,分析了刪除思想,下面我們來具體看看,以下面表格為例

<table border="1">
	<tr>
		<th>商品</th>
		<th>價格</th>
	</tr>
	<tr>
		<td>T恤</td>
		<td>¥100</td>
	</tr>
	<tr>
		<td>牛仔褂</td>
		<td>¥250</td>
	</tr>
	<tr>
		<td>牛仔庫</td>
		<td>¥150</td>
	</tr>
</table><br>

jquery如何刪除除表頭外的其他行

刪除步驟:

1、利用:not():first選擇器選取除表頭外的其他行

$("tr:not(:first)")

tr:first可以選取第一個tr元素,加了一個:not()選擇器則會選取第一行外的tr元素

例:

$("tr:not(:first)").css("background","red");

jquery如何刪除除表頭外的其他行

2、使用remove()刪除選取的全部元素

被選元素對象.remove()

完整示例:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<script src="js/jquery-1.10.2.min.js"></script>
		<script>
			$(document).ready(function() {
				$("button").on("click", function() {
					$("tr:not(:first)").remove();
				});
			});
		</script>
	</head>

	<body class="ancestors">
		<table border="1">
			<tr>
				<th>商品</th>
				<th>價格</th>
			</tr>
			<tr>
				<td>T恤</td>
				<td>¥100</td>
			</tr>
			<tr>
				<td>牛仔褂</td>
				<td>¥250</td>
			</tr>
			<tr>
				<td>牛仔庫</td>
				<td>¥150</td>
			</tr>
		</table><br>
		<button>刪除除表頭外的其他行</button>
	</body>

</html>

jquery如何刪除除表頭外的其他行

關于“jquery如何刪除除表頭外的其他行”的內容就介紹到這里了,感謝大家的閱讀。如果想了解更多行業(yè)相關的知識,可以關注億速云行業(yè)資訊頻道,小編每天都會為大家更新不同的知識點。

向AI問一下細節(jié)

免責聲明:本站發(fā)布的內容(圖片、視頻和文字)以原創(chuàng)、轉載和分享為主,文章觀點不代表本網(wǎng)站立場,如果涉及侵權請聯(lián)系站長郵箱:is@yisu.com進行舉報,并提供相關證據(jù),一經(jīng)查實,將立刻刪除涉嫌侵權內容。

AI