Datatables Jquery报错：Cannot set properties of undefined (setting '_DT_CellIndex')求助

我正在开发招生系统，使用DataTables Jquery时出现错误“Cannot set properties of undefined (setting '_DT_CellIndex')”。我知道这个问题被多次提及，但实在找不到自身代码的问题。我已尝试匹配与的数量、移除colspan等方法，但均未成功。数据加载正常，只是希望消除该错误，以下是相关代码：

window.load_tbl = function(){
        var val = document.getElementById('assignval').value;
    
        $('#faculty-tbl tbody').html('<tr><td colspan="6" class="text-center">Please Wait...</td></tr>')
        $.ajax({
            url:'functions/'+val,
            success:function(resp){
                if(typeof resp != undefined){
                    resp = JSON.parse(resp)
                    if(Object.keys(resp).length > 0){
                        $('#faculty-tbl tbody').html('')
                        var i = 1;
                        Object.keys(resp).map(k=>{
                            var date_updated = moment(resp[k].date_updated).format('MM/DD/YYYY h:mm a');
                            var tr = $('<tr></tr>')
                            tr.append('<td class="text-center"><button type="button" class="btn btn-outline-secondary">'+resp[k].id+'</button></td>')
                            tr.append('<td class="text-center">'+resp[k].firstname+'</td>')
                            tr.append('<td class="text-center">'+resp[k].middlename+'</td>')
                            tr.append('<td class="text-center">'+resp[k].lastname+'</td>')
                            if(resp[k].section_id != 0) {
                             tr.append('<td class="text-center">'+resp[k].advisory+'</td>')   
                            } else {
                             tr.append('<td class="text-center">Unassigned</td>')
                            }
                            tr.append('<td><center><button class="btn btn-info btn-sm text-white edit_faculty" data-id = "'+resp[k].id+'"><i class="fa fa-edit"></i></button><button class="btn btn-danger btn-sm remove_faculty" data-id = "'+resp[k].id+'" data-firstname="'+resp[k].firstname+'" data-middlename="'+resp[k].middlename+'" data-lastname="'+resp[k].lastname+'" data-uid="'+resp[k].user_id+'"><i class="fa fa-trash"></i></button><button class="btn btn-dark btn-sm text-white show_date" data-date = "'+date_updated+'"><i class="fa-solid fa-database"></i></button></center></td>')
                            $('#faculty-tbl tbody').append(tr)
                        })
                    }else{
                    $('#faculty-tbl tbody').html('<tr><td colspan="6" class="text-center">No Data...</td></tr>')
                    }
                }
            },
            complete:function(){
                $('#faculty-tbl').dataTable()
            }
        })
    }

    $(document).on('change', '.assigned', function() {
        if(this.checked) {
        document.getElementById('assignval').value = 'load_ajax.php?action=load_faculty';
        load_tbl();
        } else {
        document.getElementById('assignval').value = 'filter_ajax.php?action=filter_unassignedfaculty';
        load_tbl();
        }
    });

    $('#new_faculty').click(function(){
        uni_modal('Add faculty','functions/manage_faculty.php');
    })

    $(document).ready(function() {
        
        load_tbl()
        
        $('#faculty-tbl tbody').on('click', '.edit_faculty', function () {
            uni_modal("Update Faculty Information",'functions/manage_faculty.php?id='+$(this).attr('data-id'))
        });
        
        $('.help').on('click', function () {
            help_modal("Need Help?")
        });
        
        $('#faculty-tbl tbody').on('click', '.remove_faculty', function () {
            window.uid = $(this).attr('data-uid');
            window.firstname = $(this).attr('data-firstname');
            window.middlename = $(this).attr('data-middlename');
            window.lastname = $(this).attr('data-lastname');
            _conf("Are you sure to remove this data?",'remove_faculty', [$(this).attr('data-id')])
        });
        
        $('#faculty-tbl tbody').on('click', '.show_date', function () {
        static_modal("Faculty Information", "Last Date Updated: "+$(this).attr('data-date'))
        });
        
        $('#print_faculty').click(function(){
        var redirectWindow = window.open('print/report_faculty.php');
        redirectWindow.location;
        
        });
        
        $('#reloadBtn').click(function(){
        location.reload();
        });
        
        var table = $('#users-tbl')
        if (!$.fn.DataTable.isDataTable('#users-tbl')) {
           return;
        }
        else {
            var table = $('#users-tbl').DataTable();
            table.dataTable().fnDestroy();
        }
    
    });

• 修复重复初始化问题：每次执行load_tbl时，complete回调都会重新初始化DataTables，但未销毁已存在的实例，导致DOM索引混乱。修改complete回调：

  complete:function(){
      // 先销毁已存在的实例，再重新初始化
      if ($.fn.DataTable.isDataTable('#faculty-tbl')) {
          $('#faculty-tbl').DataTable().destroy();
      }
      $('#faculty-tbl').dataTable();
  }
  

• 修正空响应判断逻辑：当前if(typeof resp != undefined)判断无效，typeof resp始终为字符串，改为：

  if(resp !== undefined && resp.trim() !== ''){
      resp = JSON.parse(resp)
      // 后续逻辑...
  }
  

• 确认表头与数据列数完全匹配：再次核对<thead>中的<th>数量是否为6个，确保和数据行的<td>数量、空数据行的colspan="6"完全一致。

• 清理冗余代码：$(document).ready()中对#users-tbl的处理和当前报错无关，若页面中不存在该表格，建议删除这段代码，避免潜在错误。

内容的提问来源于stack exchange，提问作者bacon gy