So verbergen Sie die Tabelle in Javascript-js-Tutorial-php.cn

So verbergen Sie die Tabelle in Javascript

藏色散人

Freigeben： 2023-01-05 16:11:45

Original

4528 Leute haben es durchsucht

So verbergen Sie eine Tabelle in JavaScript: Erstellen Sie zunächst eine HTML-Beispieldatei. Erstellen Sie dann eine Tabelle im Hauptteil und verbergen Sie sie schließlich mithilfe des js-Codes „getElementById(„table1“).style.display=‘block‘;“ .

So verbergen Sie die Tabelle in Javascript

Die Betriebsumgebung dieses Artikels: Windows 7-System, JavaScript-Version 1.8.5, Dell G3-Computer.

Javascript zeigt eine Tabelle an und verbirgt sie

Hier werden hauptsächlich die Methode document.getElementById("Element ID") und das Attribut style.display des Elements verwendet. Der Dateiname lautet doHide.htm und der Code lautet wie folgt:

<html>
<head>
<meta http-equiv="Content-Language" content="zh-cn">
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title></title>
<script language="javascript">
function DoHide()
{
// 获得id为table1的表格，并判断它的style.display值是否等于 &#39;block &#39;
// 等于就执行 if 部分代码，不等于就执行 else 部分代码
if(document.getElementById("table1").style.display==&#39;block&#39;)
{
// 把 id 为 table1的元素的设置为隐藏
document.getElementById("table1").style.display=&#39;none&#39;;
// 把按钮（id 为 B3 ）的文字设置成 &#39;显示表格&#39;
document.getElementById("B3").value="显示表格";
}
else
{
// 把 id 为 table1的元素的设置为显示
document.getElementById("table1").style.display=&#39;block&#39;;
// 把按钮（id 为 B3 ）的文字设置成 &#39;隐藏表格&#39;
document.getElementById("B3").value="隐藏表格";
}
}
</script>
</head>
<body>
<p><input type="button" value="隐藏表格" name="B3" onclick="DoHide();"></p>
<table border="1" width="100%" id="table1" style="display:block">
<tr>
<td>这是一个表格</td>
<td>单元格2</td>
<td>单元格3</td>
<td>单元格4</td>
<td>单元格5</td>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
</tr>
<tr>
<td>2</td>
<td>2</td>
<td>2</td>
<td>2</td>
<td>2</td>
</tr>
</table>
</body>
</html>

Nach dem Login kopieren

[Empfohlenes Lernen: Javascript-Tutorial für Fortgeschrittene]

Das obige ist der detaillierte Inhalt vonSo verbergen Sie die Tabelle in Javascript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!