色婷婷狠狠18禁久久YY,CHINESE性内射高清国产,国产女人18毛片水真多1,国产AV在线观看

html table 切換代碼

HTML中的table標(biāo)簽是用來(lái)創(chuàng)建表格的,由于表格內(nèi)容通常較多,因此我們會(huì)需要在同一個(gè)頁(yè)面中展示不同的表格。這時(shí)我們就可以利用切換代碼來(lái)實(shí)現(xiàn)展示不同表格的功能。

<table id="table1">
<tr>
<th>姓名</th>
<th>年齡</th>
<th>性別</th>
</tr>
<tr>
<td>張三</td>
<td>20</td>
<td>男</td>
</tr>
<tr>
<td>李四</td>
<td>22</td>
<td>男</td>
</tr>
</table>
<table id="table2" style="display:none">
<tr>
<th>國(guó)家</th>
<th>語(yǔ)言</th>
</tr>
<tr>
<td>中國(guó)</td>
<td>中文</td>
</tr>
<tr>
<td>美國(guó)</td>
<td>英語(yǔ)</td>
</tr>
</table>

代碼中我們創(chuàng)建了兩個(gè)表格,其中第一個(gè)表格的id為"table1",第二個(gè)表格的id為"table2",并為第二個(gè)表格添加了style屬性,將其display設(shè)為none,使其在頁(yè)面中隱藏。接下來(lái),我們需要實(shí)現(xiàn)切換展示的功能,可以通過(guò)點(diǎn)擊按鈕、鏈接等元素觸發(fā)相應(yīng)的事件。

<button onclick="switchTable()">切換表格</button>
<script>
function switchTable(){
var table1 = document.getElementById("table1");
var table2 = document.getElementById("table2");
if(table1.style.display === "none"){
table1.style.display = "table";
table2.style.display = "none";
}else{
table1.style.display = "none";
table2.style.display = "table";
}
}
</script>

在代碼中,我們創(chuàng)建了一個(gè)按鈕并添加了onclick事件,使其點(diǎn)擊時(shí)可以執(zhí)行switchTable函數(shù)。在函數(shù)中,我們通過(guò)getElementById方法獲取到表格元素,并判斷其display屬性是否為"none"。如果是,則將其display設(shè)置為"table",并將另一個(gè)表格的display設(shè)為"none",從而實(shí)現(xiàn)表格的切換。在頁(yè)面中添加上述代碼后,我們便可以實(shí)現(xiàn)簡(jiǎn)單的表格切換功能。