JavaScriptでテーブルテーブルを削除する方法

青灯夜游
リリース: 2023-01-05 16:12:08
オリジナル
6884 人が閲覧しました

テーブルを削除する Javascript メソッド: 最初に「document.getElementById()」メソッドを使用してテーブル要素オブジェクトとその親要素オブジェクトを取得し、次に「親要素オブジェクト.removeChild (テーブル要素オブジェクト)」を使用します。 " ステートメントを削除するだけのフォームです。

JavaScriptでテーブルテーブルを削除する方法

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

#テーブルを削除する Javascript メソッド:

    #テーブルの親要素オブジェクトとテーブル オブジェクトを取得します
  • remove() メソッドを使用してテーブル オブジェクトを削除します
  • コード例:
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
	</head>

	<body id="body">
		<table border="1" id="table">
			<tr>
				<th>name</th>
				<th>job</th>
			</tr>
			<tr>
				<td>灭绝师太</td>
				<td>PHP中文网高级讲师</td>
			</tr>
			<tr>
				<td>欧阳克</td>
				<td>PHP中文网讲师</td>
			</tr>
			<tr>
				<td>韦小宝</td>
				<td>PHP中文网初级讲师</td>
			</tr>
		</table>
		<p id="demo">点击按钮,删除table表格。</p>
		<button onclick="myFunction()">点击按钮</button>
	</body>
<script>
	function myFunction() {
		var body = document.getElementById("body");
		var table = document.getElementById("table");
		body.removeChild(table);
	}
</script>
</html>
ログイン後にコピー

レンダリング:

JavaScriptでテーブルテーブルを削除する方法

説明:

remove() メソッドを使用すると、すべてのテキスト ノードと子ノードを含む、親ノード上のすべての要素を削除できます。

要素を検索する方法:

1. id に基づいて要素を取得

document.getElementById("id属性的值");
ログイン後にコピー

2. タグ名に基づいて要素を取得

document.getElementsByTagName("标签的名字");
ログイン後にコピー

3. name 属性の値に基づいて要素を取得します

document.getElementsByName("name属性的值");
ログイン後にコピー

4. class 属性

document.getElementsByClassName("类样式的名字");
ログイン後にコピー

に基づいて要素を取得します. CSS パスに基づいて要素を取得します ( 1 つ取得します)

document.querySelector("css路径");
ログイン後にコピー

6. CSS パスに基づいて要素を取得します (グループを取得します)

document.querySelectorAll("css路径");
ログイン後にコピー

[推奨学習:

JavaScript 上級チュートリアル

]

以上がJavaScriptでテーブルテーブルを削除する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート
私たちについて 免責事項 Sitemap
PHP中国語ウェブサイト:福祉オンライン PHP トレーニング,PHP 学習者の迅速な成長を支援します!