// función para obtener las columnas en un objeto
function getRows(json, index) {
  var _index = index | 0;
  var row = [];

  // recorro el json por key
  for (key in json) {
    // agrego los textos correspondientes
    row.push({
      param: key,
      type: typeof json[key],
      example: typeof json[key] !== "object" ? json[key] : "",
      // esto es para saber la posición de los td
      _index: _index
    });

    // si es un objeto entonces lo recorro
    if (typeof json[key] === "object") {
      row = row.concat(getRows(json[key], _index + 1));
    }
  }
  return row;
}

var json = {
  HeaderJson: {
    Sistema: { codigo: "00001", nombre: "APP", lang: "es" },
    Traza: {
      timestamp: "2017-12-14T16:11:01.282Z",
      trazaID: "ASDA2232134124ASDS",
      Servicio: { nombre: "Orden", operacion: "Obtener" }
    }
  },
  BodyJson: { Orden: { ordenID: "1232132134" } }
};
var table = document.querySelector("table");
var rows = getRows(json);

// armo los tr y td para la tabla

// armo el header de la tabla
var tr = document.createElement("tr");
// obtengo el número máximo de _index
var tdLength = Math.max.apply(
  Math,
  rows.map(function(object) {
    return object._index;
  })
);
for (var i = 0; i <= tdLength; i++) {
  var th = document.createElement("th");
  var text = document.createTextNode(rows[i]._index === 0 ? "Parametro" : "");
  th.appendChild(text);
  tr.appendChild(th);
}
var thTipo = document.createElement("th");
thTipo.appendChild(document.createTextNode("Tipo"));
tr.appendChild(thTipo);

var thExample = document.createElement("th");
thExample.appendChild(document.createTextNode("Ejemplo"));
tr.appendChild(thExample);
table.appendChild(tr);

// recorro todos las columnas del objeto
for (var i = 0; i < rows.length; i++) {
  var tr = document.createElement("tr");

  for (var j = 0; j <= tdLength; j++) {
    var td = document.createElement("td");
    var text = document.createTextNode(
      rows[i]._index === j ? rows[i].param : ""
    );
    td.appendChild(text);
    tr.appendChild(td);
  }

  var tdTipo = document.createElement("td");
  tdTipo.appendChild(document.createTextNode(rows[i].type));
  tr.appendChild(tdTipo);

  var tdExample = document.createElement("td");
  tdExample.appendChild(document.createTextNode(rows[i].example));
  tr.appendChild(tdExample);

  table.appendChild(tr);
}