<table id="myTable">
<tr>
<th>이름</th>
<th>나이</th>
</tr>
<tr>
<td>John</td>
<td>25</td>
</tr>
<tr>
<td>Jane</td>
<td>30</td>
</tr>
<tr>
<td>Alex</td>
<td>28</td>
</tr>
</table>
<button id="hideRowBtn">행 숨기기</button>
<button id="showRowBtn">행 보이기</button>
const hideRowButton = document.getElementById("hideRowBtn");
const showRowButton = document.getElementById("showRowBtn");
hideRowButton.addEventListener("click", hideTableRow);
showRowButton.addEventListener("click", showTableRow);
function hideTableRow() {
const myTable = document.getElementById("myTable");
const rows = myTable.getElementsByTagName("tr");
if (rows.length > 1) {
rows[rows.length - 1].style.display = "none";
}
}
function showTableRow() {
const myTable = document.getElementById("myTable");
const rows = myTable.getElementsByTagName("tr");
if (rows.length > 1) {
rows[rows.length - 1].style.display = "";
}
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.