1. Menerapkan kode sumber
Salinan kode adalah sebagai berikut:
<! Doctype html public "-// w3c // dtd xhtml 1.0 transisi // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">
<html xmlns = "http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv = "konten tipe" content = "text /html; charset = utf-8" />
<iteme> Implementasi JavaScript mendapatkan nilai kolom di tabel </iteme>
<type skrip = "Teks/JavaScript">
fungsi getTdvalue ()
{
var tableId = document.getElementById ("tab");
var str = "";
untuk (var i = 1; i <tabelid.rows.length; i ++)
{
alert (Tableid.rows [i] .cells [1] .innerhtml);
}
}
</script>
</head>
<body>
<tabel id = "tab" onclick = "getTdvalue ()" cellPadding = "1" cellPacing = "1">
<tr style = "latar belakang-warna: #ccc;">
<th> Nomor Siswa </th>
<th> nama </t>
<th> gender </th>
<th> usia </t>
</tr>
<tr>
<td> 1 </td>
<td> li si </td>
<td> pria </td>
<td> 22 </td>
</tr>
<tr>
<td> 2 </td>
<td> wang qian </td>
<td> wanita </td>
<td> 20 </td>
</tr>
<tr>
<td> 3 </td>
<td> yu qian </td>
<td> pria </td>
<td> 18 </td>
</tr>
<tr>
<td> 4 </td>
<td> liu Lang </td>
<td> wanita </td>
<td> 19 </td>
</tr>
<tr>
<td> 5 </td>
<td> Zhuge Liang </td>
<td> pria </td>
<td> 20 </td>
</tr>
<tr>
<td> 6 </td>
<td> cloud oriental </td>
<td> wanita </td>
<td> 21 </td>
</tr>
<tr>
<td> 7 </td>
<td> gongsun ce </td>
<td> pria </td>
<td> 22 </td>
</tr>
<tr>
<td> 8 </td>
<td> Baoqing </td>
<td> wanita </td>
<td> 23 </td>
</tr>
<tr>
<td> 9 </td>
<td> Pendidikan Intelektual </td>
<td> pria </td>
<td> 20 </td>
</tr>
<tr>
<td> 10 </td>
<td> liu Sisi </td>
<td> wanita </td>
<td> 21 </td>
</tr>
</boable>
</body>
</html>
2. Hasil desain
(1) Inisialisasi
(2) Saat mengklik kolom kedua