Hai teman-teman, kali ini saya akan memberikan cara Insert TableRow Dengan Javascript , maksutnya seperti apa sih ? nah yang saya maksud di sini adalah kita akan menambahkan row dan kolom di dalam suatu table dengan bantuan javascript. itu tujuanya. Mau tau ?
Di sini saya telah menyiapkan baris program yang berfunsi untuk menambahakan row dalam suatu table dengan bantuan javascript, kalian bisa langsung dapat copy and paste ke dalam text editor kalian dan jalankan di browser masing-masing.
<!DOCTYPE html>
<html>
<head>
<style>
table, td {
border: 1px solid black;
}
</style>
</head>
<body>
<p>Klik pada bagian button maka row akan bertambah.</p>
<table id="TableBaru">
<tr>
<td>Row1 cell1</td>
<td>Row1 cell2</td>
</tr>
<tr>
<td>Row2 cell1</td>
<td>Row2 cell2</td>
</tr>
<tr>
<td>Row3 cell1</td>
<td>Row3 cell2</td>
</tr>
</table>
<br>
<button onclick="myFunction()">Tambah</button>
<script>
function myFunction() {
var table = document.getElementById("TableBaru");
var row = table.insertRow(0);
var cell1 = row.insertCell(0);
var cell2 = row.insertCell(1);
cell1.innerHTML = "CELL1 baru";
cell2.innerHTML = "CELL2 baru";
}
</script>
</body>
</html>setelah kalian jalankan maka hasilnya akan seperti ini :
Pada gambar di atas terdapa button tambah , apabila kalian klik tombol tersebut maka row dan kolom pada table tersebut akan bertambah secara otomatis tanpa perlu di tambahkan di dalam koding. Hasilnya seperti ini :
Bisa kalian lihat, ada pertambahan baris dan kolom sesuai yang kita ingginkan.
Baik itulah tutorial sederhana dari saya, sampai bertemu pada artikel selanjutnya.
The post Insert TableRow Dengan Javascript appeared first on Kursus Website Terbaik.