使用Jquery按列连接表

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

<table id="table1">
  <tr>
    <th>Column 1</th>
    <th>Column 2</th>
  </tr>
  <tr>
    <td>Data 1</td>
    <td>Data 2</td>
  </tr>
</table>

<table id="table2">
  <tr>
    <th>Column 3</th>
    <th>Column 4</th>
  </tr>
  <tr>
    <td>Data 3</td>
    <td>Data 4</td>
  </tr>
</table>

$(document).ready(function() {
  var table1 = $('#table1');
  var table2 = $('#table2');
  
  var newTable = $('<table></table>');
  
  // 遍历第一张表格的列
  table1.find('tr').each(function(rowIndex, row) {
    $(row).find('th, td').each(function(colIndex, cell) {
      // 创建新的行和单元格
      if (rowIndex === 0) {
        newTable.append('<tr></tr>');
      }
      newTable.find('tr').eq(colIndex).append('<td>' + $(cell).text() + '</td>');
    });
  });
  
  // 遍历第二张表格的列
  table2.find('tr').each(function(rowIndex, row) {
    $(row).find('th, td').each(function(colIndex, cell) {
      // 创建新的单元格
      newTable.find('tr').eq(colIndex).append('<td>' + $(cell).text() + '</td>');
    });
  });
  
  // 将新的表格添加到页面中
  $('body').append(newTable);
});