jsp部分（此处只有table 其他无关）：
<table id="dataTable" class="table table-striped table-list table-bordered" width="100%"> <thead> <tr id="colTr"> </tr> </thead> <tbody id="colTb"> </tbody> </table>
js部分：
//datatable表头 var dataTable; $(function(){ //查询按钮 $("#searchBtn").click(function(){ debugger; init(); }); }) function init(){ var id= $("input:hidden[name='id']").val(),//input type为hidden时的取值方式 name= $('#name').val();//input为text时的取值 var param = { id: id, name: name }; $.ajax({ url : url,//url type : 'POST', data : param, success : function(resdata) { //请求成功后 如果存在datatable结构销毁 if(dataTable){ dataTable.destroy(); } //清空table数据 $("#colTb").html(""); var colsDef = [];//定义表头列名 var obj = resdata.colist;//获取表头列名List var tableData = resdata.data;//获取table数据 var cols = obj.length; if(cols>0){//构建jsp的table表头显示 $("#colTr").html((function (cols){ var html = ""; var colsNameCN; for(var i=0;i<cols;i++){ //这里遍历后台返回的字段信息集合 //alert(obj[i].column_cn); colsNameCN=obj[i].view_name_cn;//这里取的字段信息的中文名 var html1="" if(colsNameCN.length>15){//字段中文名过长截取显示 html1 += "<span title='"+colsNameCN+"'>"+ colsNameCN.substr(0, 14) + "...</span>";//title鼠标悬浮显示全部字段中文名 html += $("<th></th>").append(html1).prop("outerHTML");//构建table表头的html }else{ html += $("<th></th>").append(colsNameCN).prop("outerHTML");//构建table表头的html } } return html; })(cols)); } if(cols>0){ for(var i=0;i<cols;i++){ var colsNameEN; colsNameEN=obj[i].column_en;//这里取的字段信息的英文名 和tabledata的key值对应 colsDef.push((function (colsNameEN){ var colItem = { data:colsNameEN, render: function( data, type, full, meta ) { if(data){ return data; }else{ return ""; } } } return colItem; })(colsNameEN)); } } //datatable初始化 dataTable = $('#dataTable').DataTable({ "ordering": false, "info": true, "bLengthChange": false, "iDisplayLength":10, "bFilter": true, "retrieve": true, "processing": true, "scrollX": true, "fixedColumns": true, "bScrollAutoCss": true, "language": { "search": "过滤：", "lengthMenu": "每页 _MENU_ 条记录", "loadingRecords": "请等待，数据正在加载中......", "zeroRecords": "没有找到记录", "info": "从 _START_ 到 _END_ 条记录 总记录数为 _TOTAL_ 条，第 _PAGE_ 页 ( 总共 _PAGES_ 页 )", "infoEmpty": "没有数据", "infoFiltered": "(从 _MAX_ 条数据中检索)", "oPaginate": { "processing": "正在查询中...", "sFirst": "首页", "sPrevious": "前一页", "sNext": "后一页", "sLast": "尾页" } }, data:tableData, columns: colsDef }); //全选 $('#checkAll').click(function() { $('[name=id]:checkbox').prop('checked', this.checked); }); }, error: function () { alert("请求失败") } }); }
java后台返回数据
List<数据实体类> list = new ArrayList<TStdataTypeEntity>(); List<列名实体类> listcolu = new ArrayList<TColuEntity>(); Map<String,Object> map = new HashMap<String,Object>(); map.put("data", list);//table数据 map.put("colist", listcolu);//表头列名 return map; 列名实体类： private String column_en; //列名中文名 对应obj[i].column_en private String column_cn; //列名英文名 对应obj[i].column_cn
看到了一个比较简单的动态表头的实现方法 根据需要选择怎么实现吧 附上链接：
https://blog.csdn.net/weixin_40408338/article/details/80900614