How to delete table table in javascript-JS Tutorial-php.cn

How to delete table table in javascript

青灯夜游

Release： 2023-01-05 16:12:08

Original

6974 people have browsed it

Javascript method to delete a table: First use the "document.getElementById()" method to obtain the table element object and its parent element object; then use the "parent element object.removeChild (table element object)" statement to delete Just form.

How to delete table table in javascript

The operating environment of this tutorial: windows7 system, javascript version 1.8.5, Dell G3 computer.

Javascript method of deleting a table:

Get the parent element object and table object of the table
Use the remove() method to delete the able table object

Code example:

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

Copy after login

Rendering:

How to delete table table in javascript

Description:

The remove() method can be used to delete all elements on the parent node, including all text and child nodes.

Methods to find elements:

1. Get elements based on id

document.getElementById("id属性的值");

Copy after login

2. Get elements based on tag names

document.getElementsByTagName("标签的名字");

Copy after login

3. Get the element based on the value of the name attribute

document.getElementsByName("name属性的值");

Copy after login

4. Get the element based on the class attribute

document.getElementsByClassName("类样式的名字");

Copy after login

5. Get the element based on the css path (get one)

document.querySelector("css路径");

Copy after login

6. Get elements based on css path (get a group)

document.querySelectorAll("css路径");

Copy after login

[Recommended learning: javascript advanced tutorial]

The above is the detailed content of How to delete table table in javascript. For more information, please follow other related articles on the PHP Chinese website!