Comment masquer plusieurs tds spécifiés dans jquery-Questions et réponses frontales-php.cn

Comment masquer plusieurs tds spécifiés dans jquery

青灯夜游

Libérer： 2022-06-10 14:09:28

original

2631 Les gens l'ont consulté

Comment masquer plusieurs éléments td spécifiés dans jquery : 1. Ajoutez des attributs de classe à plusieurs éléments td qui doivent être masqués et définissez les valeurs d'attribut sur la même valeur 2. Utilisez l'attribut de classe pour obtenir plusieurs td spécifiés ; éléments, en utilisant la syntaxe "$(". La valeur de l'attribut de classe ")" renverra un objet jQuery contenant plusieurs éléments td spécifiés. 3. Utilisez la fonction hide() pour masquer les éléments td obtenus, la syntaxe est "objet élément td ; .cacher()".

Comment masquer plusieurs tds spécifiés dans jquery

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

Méthode jquery pour masquer plusieurs td spécifiés

1 Ajoutez des attributs de classe à plusieurs éléments td qui doivent être masqués et définissez la valeur de l'attribut sur la même valeur, telle que "box"

<table border="1">
	<tr>
		<th>商品</th>
		<th>价格</th>
	</tr>
	<tr>
		<td class="box">T恤</td>
		<td>￥100</td>
	</tr>
	<tr>
		<td class="box">牛仔褂</td>
		<td class="box">￥250</td>
	</tr>
	<tr>
		<td>牛仔库</td>
		<td>￥150</td>
	</tr>
</table>

Copier après la connexion

2. L'utilisation de l'attribut class pour obtenir plusieurs éléments td spécifiés

$(".class属性值")

Copier après la connexion

renverra des objets jQuery contenant plusieurs éléments td spécifiés

3. Utilisez la fonction hide() pour masquer les objets obtenus (éléments td)

td对象.hide()

Copier après la connexion

Code d'implémentation :

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<script src="./js/jquery-3.6.0.min.js"></script>
		<script>
			$(document).ready(function() {
				$("button").on("click", function() {
					$(".box").hide();
				});
			});
		</script>
	</head>
	<body>

		<table border="1">
			<tr>
				<th>商品</th>
				<th>价格</th>
			</tr>
			<tr>
				<td class="box">T恤</td>
				<td>￥100</td>
			</tr>
			<tr>
				<td class="box">牛仔褂</td>
				<td class="box">￥250</td>
			</tr>
			<tr>
				<td>牛仔库</td>
				<td>￥150</td>
			</tr>
		</table><br>
		<button>隐藏多个td元素</button>
	</body>
</html>

Copier après la connexion

Comment masquer plusieurs tds spécifiés dans jquery