表頭缺少導出PDF

Question

我想轉換HTML5表使用jspdf（類似於Export HTML table to pdf using jspdf）。 然而，在我的表中的元素是動態生成

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手動創建表（複製 - 粘貼），表頭將呈現。 任何幫助，將不勝感激。謝謝

Answer 1

th元素必須包裝tr元素。然後tr被附加到thead，最後到表元素。

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; 
    }