jquery - Add Caption and Thead using javascript -
i have made html table java script not understanding how add caption , thead.
var arr =[ ["period ends", "payroll due", "payday"], ["06/13/15", "06/19/15", "06/26/15"], ]; var body, tab, th, tr, td, tn, row, col; body = document.getelementsbytagname('body')[0]; tab = document.createelement('table'); (row=0; row < arr.length; row++){ tr = document.createelement('tr'); (col=0; col < arr[row].length; col++){ td = document.createelement('td'); tn = document.createtextnode(arr[row][col]); td.appendchild(tn); tr.appendchild(td); } tab.appendchild(tr); } body.appendchild(tab);
this approach use
var arr =[ ["period ends", "payroll due", "payday"], ["06/13/15", "06/19/15", "06/26/15"], ]; var body = document.getelementsbytagname('body')[0]; var tab = document.createelement('table'); var cap = tab.createcaption(); var tr, td, col; // set caption cap.innerhtml = 'my table caption'; // start first row (skip row headings) (var row=1; row < arr.length; row++){ tr = tab.insertrow(row-1); (col=0; col < arr[row].length; col++){ td = tr.insertcell(col); td.innerhtml = arr[row][col]; } } // add row headings var header = tab.createthead() var headerrow = header.insertrow(0); (col=0; col < arr[0].length; col++){ td = headerrow.insertcell(col); td.innerhtml = arr[0][col]; } body.appendchild(tab);
this makes use of html-spec methods creating table elements
createcaption
insertrow
createthead
insertcell
innerhtml
the quirk found had add thead
after body
rows
here's jsfiddle
Comments
Post a Comment