Jquery根据单元格加载不同的HTML内容

<table id="myTable">
  <tr>
    <td class="cellTypeA">Cell A1</td>
    <td class="cellTypeB">Cell B1</td>
  </tr>
  <tr>
    <td class="cellTypeA">Cell A2</td>
    <td class="cellTypeB">Cell B2</td>
  </tr>
</table>

$(document).ready(function() {
  $('#myTable td').each(function() {
    var cellType = $(this).attr('class');
    switch(cellType) {
      case 'cellTypeA':
        $(this).html('<div>Content for Type A</div>');
        break;
      case 'cellTypeB':
        $(this).html('<div>Content for Type B</div>');
        break;
      default:
        $(this).html('<div>Default Content</div>');
    }
  });
});

$(document).ready(function() {
  $('#myTable td').each(function() {
    var cellType = $(this).attr('class');
    $.ajax({
      url: 'get_content.php', // 假设这是一个服务器端脚本
      data: { type: cellType },
      success: function(response) {
        $(this).html(response);
      }.bind(this) // 使用 bind 确保 this 指向正确的元素
    });
  });
});