导出的 PDF 中缺少表头答案

【问题标题】：Table header missing from exported PDF导出的 PDF 中缺少表头
【发布时间】：2014-10-06 15:01:12
【问题描述】：

我正在尝试使用 jspdf (类似于Export HTML table to pdf using jspdf) 转换 HTML5 表格。但是，我表中的元素是动态生成的

function createTable(){
    var reportDiv = document.getElementById('customers');
    var table = document.createElement('table');
    table.id = 'tab_customers';
    table.className = 'table table-striped';
    var thead = document.createElement('thead');


    var tableHeader = document.createElement('th');
    tableHeader.innerHTML = "Name";
    thead.appendChild(tableHeader);

    var tableHeader = document.createElement('th');
    tableHeader.innerHTML = "Status";
    thead.appendChild(tableHeader);


    table.appendChild(thead);

    var row = table.insertRow(0);
    var cell1 = row.insertCell(0);
    var cell2 = row.insertCell(1);

    cell1.innerHTML = "json";
    cell2.innerHTML = "fail";

    reportDiv.appendChild(table);
   return reportDiv;
}

创建了 PDF，但问题是它无法显示表头。但是，如果我从上面的 dom 手动创建表（复制 - 粘贴），则会呈现表头。对此的任何帮助将不胜感激。谢谢

【问题讨论】：

标签： jspdf

【解决方案1】：

th 元素必须包裹在 tr 元素周围。然后将 tr 附加到 thead，最后附加到 table 元素。

 function createTable(){
        var reportDiv = document.getElementById('customers1');
        var table = document.createElement('table');
        table.id = 'tab_customers1';
        table.className = 'table table-striped';
        var thead = document.createElement('thead');
        var tr = document.createElement('tr');

        var tableHeader = document.createElement('th');
        tableHeader.innerHTML = "Name";
        tr.appendChild(tableHeader);

        var tableHeader = document.createElement('th');
        tableHeader.innerHTML = "Status";
        tr.appendChild(tableHeader);

        thead.appendChild(tr);

        table.appendChild(thead);

        var row = table.insertRow(0);
        var cell1 = row.insertCell(0);
        var cell2 = row.insertCell(1);

        cell1.innerHTML = "json";
        cell2.innerHTML = "fail";

        reportDiv.appendChild(table);
       return reportDiv;
    }

【讨论】：