Post
Ask Question

Invert HTML Table using JavaScript

Using Invert Table Function to invert table
object parameter to pass table object

  1. function invertTable(object)  
  2. {  
  3.     var oldTable = object,  
  4.         invertedTable = [],  
  5.         newInvertTable, newInvertTr, k = 0,  
  6.         c = 0,  
  7.         d = 0,  
  8.         i = 0,  
  9.         j = 0;  
  10.     var oldTr = oldTable.querySelectorAll("tr");  
  11.     for (k = 0; k < oldTable.querySelectorAll("td").length; k++) invertedTable.push([]);  
  12.     for (c = 0; c < oldTr.length; c++)  
  13.     {  
  14.         for (d = 0; d < oldTr[c].childNodes.length; d++)  
  15.         {  
  16.             invertedTable[d][c] = (oldTr[c].childNodes[d])  
  17.         }  
  18.     }  
  19.     oldTable.innerHTML = ""  
  20.     newInvertTable = oldTable;  
  21.     var newthead = document.createElement('thead');  
  22.     var newtbody = document.createElement('tbody');  
  23.     for (i = 0; i < invertedTable.length; i++)  
  24.     {  
  25.         if (invertedTable[i] != undefined)  
  26.         {  
  27.             newInvertTr = document.createElement('tr');  
  28.             for (j = 0; j < invertedTable[i].length; j++)  
  29.             {  
  30.                 if (invertedTable[i][j] != undefined)  
  31.                 {  
  32.                     if (invertedTable[i][j].tagName.toUpperCase() == "TH")  
  33.                     {  
  34.                         newInvertTr.appendChild(invertedTable[i][j]);  
  35.                         newthead.appendChild(newInvertTr);  
  36.                     }  
  37.                     else  
  38.                     {  
  39.                         newInvertTr.appendChild(invertedTable[i][j]);  
  40.                         newtbody.appendChild(newInvertTr);  
  41.                     }  
  42.                 }  
  43.             }  
  44.             newInvertTable.appendChild(newthead);  
  45.             newInvertTable.appendChild(newtbody);  
  46.         }  
  47.     }  
  48.     invertedTable.length = 0;  
  49. }