ホームページ  >  記事  >  ウェブフロントエンド  >  jqueryで要素を非表示にする方法

jqueryで要素を非表示にする方法

青灯夜游
青灯夜游オリジナル
2022-05-07 19:31:513550ブラウズ

方法: 1. 表示スタイルを追加して非表示にするには、「$("th").hide()」を使用します。 2. 「$("th").fadeOut()」または「$( "」を使用します。 th").fadeTo(milliseconds,0)"、透明度を変更して非表示にします; 3. "$("th").slideUp()" を使用します。

jqueryで要素を非表示にする方法

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

タグは、HTML テーブルのヘッダー セルを定義します。

例:

<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で要素を非表示にする方法

次に、jquery を使用して th 要素を非表示にします

1. 選択した要素を非表示にするには、 hide()

hide() メソッドを使用します (要素に display:none スタイルを追加することで非表示にします)。

$(document).ready(function() {
	$("button").click(function() {
		$("th").hide();
	});
});

jqueryで要素を非表示にする方法

2. fadeOut()

fadeOut() メソッドを使用して、選択した要素の不透明度を段階的に変更します。表示から非表示 (フェード効果)。

$(document).ready(function() {
	$("button").click(function() {
		$("th").fadeOut();
	});
});

jqueryで要素を非表示にする方法

3. fadeTo()

fadeTo() メソッドを使用して、選択した要素の不透明度を段階的に変更します。指定された値 (フェード効果)。

最終的な不透明度を 0 に設定するだけです。

$(document).ready(function() {
	$("button").click(function() {
		$("th").fadeTo(1000,0);
	});
});

jqueryで要素を非表示にする方法

4. slideUp()

slideUp() メソッドを使用して、選択した要素をスライド式に非表示にします。

$(document).ready(function() {
	$("button").click(function() {
		$("th").slideUp();
	});
});

jqueryで要素を非表示にする方法

[推奨学習: jQuery ビデオ チュートリアル Web フロントエンド ビデオ ]

以上がjqueryで要素を非表示にする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。