我使用 $.map 函数成功地将我的表转换为对象。但是,我想转换<tr> to <dl> <th> to <dt> <td> to <dd>
然后将结果附加到页面上并最终从视图中隐藏原始表。
注意:每个表的实际行数会有所不同。我假设网站上的所有表格都有thead
HTML:期望的结果
<div id="item">
<dl>
<dt>First Name:</dt>
<dd>James</dd>
<dt>Last Name:</dt>
<dd>Matman</dd>
<dt>Job Title:</dt>
<dd>Chief Sandwich Eater</dd>
</dl>
<dl>
<dt>First Name:</dt>
<dd>The</dd>
<dt>Last Name:</dt>
<dd>Tick</dd>
<dt>Job Title:</dt>
<dd>Crimefighter Sorta</dd>
</dl>
</div>
HTML:当前
<div id="item"></div>
<table>
<thead>
<tr>
<th>First Name</th>
<th>Last Name</th>
<th>Job Title</th>
</tr>
</thead>
<tbody>
<tr>
<td>James</td>
<td>Matman</td>
<td>Chief Sandwich Eater</td>
</tr>
<tr>
<td>The</td>
<td>Tick</td>
<td>Crimefighter Sorta</td>
</tr>
</tbody>
</table>
jQuery
var rowCount = $("tbody > tr").length;
var items = [];
var headers = [];
$("thead th").each(function() {
headers.push($(this).text());
});
var tbl = $('table tbody tr').map(function(r) {
return $(this).find('td').map(function(c) {
return {
row:r + 1,
col:c + 1,
cell: $(this).text()
}
}).get();
}).get();
console.log(tbl);
//$("#item").html(JSON.stringify(items));