JSFiddle - React, Tailwind, and code Playground
HTML
<center>
<table cellspacing="1" cellpadding="1" border="3" rules="all">
<tbody>
<tr>
<td align="center">
<table>
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
</td>
<td nowrap="1" align="center" colspan="12">
<table>
<tbody>
<tr>
<td nowrap="1" align="center"><font size="2" face="Arial" color="#000000">
Caption 1
</font></td>
</tr>
</tbody>
</table>
</td>
<td nowrap="1" align="center" colspan="12">
<table>
<tbody>
<tr>
<td nowrap="1" align="center"><font size="2" face="Arial">
Caption 2
</font></td>
</tr>
</tbody>
</table>
</td>
<td nowrap="1" align="center" colspan="12">
<table>
<tbody>
<tr>
<td nowrap="1" align="center"><font size="2" face="Arial">
Caption 3
</font></td>
</tr>
</tbody>
</table>
</td>
<td nowrap="1" align="center" colspan="12">
<table>
<tbody>
<tr>
<td nowrap="1" align="center"><font size="2" face="Arial">
Caption 4
</font></td>
</tr>
</tbody>
</table>
</td>
<td nowrap="1" align="center" colspan="12">
<table>
<tbody>
<tr>
<td nowrap="1" align="center"><font size="2" face="Arial">
Caption 5
</font></td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td nowrap="1" align="center" rowspan="2">
<table>
<tbody>
<tr>
<td nowrap="1" align="center"><font size="2" face="Arial">
<b>1</b>
...
JavaScript
// ### debug ###
$('table').on('click', 'td[rowspan]', function () {
var $this = $(this),
num = $this.siblings(':first-child').text().trim(),
pos = $this.index() + 1,
name = $this.parent().siblings().first().children(':nth-child(' + pos + ')').text().trim();
alert(num + ':' + name);
});
// ### /debug ###
$(document).ready(function () {
$("table").find("tr:has(td[rowspan])").each(function (index, obj) {
$(this).find("td").each(function (index, obj) {
// debug
$(this).css('border', 'solid 1px red');
var $this = $(this),
num = $this.siblings(':first-child').text().trim(),
pos = $this.index() + 1,
name = $this.parent().siblings().first().children(':nth-child(' + pos + ')').text().trim();
if ($this.attr("rowspan") && $this.attr("colspan")) {
// debug
console.log((num + ':' + name));
}
// ...
});
});
});