Question

Alguien me podría decir cual es la manera mas fácil o sencilla de crear tablas usando un botón solo con html y js.
Lo he intentado creando una funcion en el script y luego la llamo en el evento onclick pero cuando doy click en el botón y llamo al método para crear la tabla, el documento html queda en blanco, es decir pierde toda su estructura y a cambio genera un nuevo html =S. soy nuevo por eso no entiendo mucho, lo que hago es esto:

<script>funtion creartabla(){document.write(<table><tr><td>etcetcetc</td></tr></table>)}</script>
<button onclick='creartabla'></button>

Comments

no sabia que la pregunta leía código html xD

Editado: Movido a comentario.
Para que el código se vea bien, seleccionalo y usá la herramienta { } que aparece como "code sample"

Answer 1

Hola Kevin,

para crear una tabla en un documento HTML que ya tiene elementos, tenés que usar la función de JavaScript createelement()

Acá hay un ejemplo: https://developer.mozilla.org/es/docs/Trazado_de_una_tabla_HTML_mediante_JavaScript_y_la_Interface_DOM

Si la tabla no es muy compleja ni grande, tambíen podrías hacer apacerla dentro de un DIV usando la propiedad innerHTML

document.getElementById('un_div").innerHTML = "<table><tr><td>hola</td></tr></table>";

Saludos!

Answer 2

Hola, buen día!

Todo depende de cómo hagas tu rutina en JS. Si le das el comonado (por ejemplo):

 document.write("<table>");

esto lo que hace es sobreescribir el contenido de la página completamente y mostrar la tabla que hayas creado.

Lo que te recomiendo es que crees un DIV dentro de tu página de inicio y que lo dejes vacío al final de tu página o donde quieras que aparezca. Luego en tu Script crea una cadena (string) que contenga todas las líneas de la tabla que vas a agregar. Una vez que tengas toda la cadena con lo que vas a agregar usas el ID del DIV que creaste y utilizas lo siguiente:

// Asumo que el ID del DIV es divResultados
var Result = document.getElementById("divResultados");
// Luego lo llenamos con la cadena que creaste:
Result.innerHTML = sTablaCreada

Una vez que sale de la función mostrará en el Div el contenido que creaste. Espero te sirva y ayude!