0

Estoy realizando una tabla de 4 casillas, 2x2, y he creado los elementos mediante DOM, sólo se puede utilizar funciones DOM.

¿Por qué no me genera la tabla?

Código HTML:

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
        <title>Animales!</title>
        <link rel="stylesheet" href="style/estilo.css"/>
        <script type="text/JavaScript" src="js/animales.js"></script>
    </head>

    <body>

    </body>
</html>

Código Javascript/DOM:

/*Registro un evento para cuando termine de cargarse el documento se cargen los eventos necesarios.*/
window.onload = crearTabla();

/*Exclusivamente con DOM, crear una tabla 2x2 (4 elementos-casillas).*/
function crearTabla() {
    //Obtener la referencia del elemento body.
    var body = document.getElementsByTagName("body")[0];

    //Crea un elemento <table> y un elemento <tbody>.
    var tabla = document.createElement("table");
    var tblBody = document.createElement("tbody");

    //Crea las celdas.
    for (var i=0; i<2; i++) {
        //Crea las hileras de la tabla.
        var hilera = document.createElement("tr");
        for (var j=0; j<2; j++) {
            var celda = document.createElement("td");
            var textoCelda = document.createTextNode("Hilera "+i+", Columna "+j);
            celda.appendChild(textoCelda);
            hilera.appendChild(celda);
        }
        //Agrega la hilera al final de la tabla (al final del elemento tblbody).
        tblBody.appendChild(hilera);
    }

    //Posiciona el <tbody> debajo del elemento <table>.
    tabla.appendChild(tblBody);
    //appends <table> into <body>.
    body.appendChild(tabla);
    //Modifica el atributo "border" de la tabla y lo fija a "2";
    tabla.setAttribute("border", "2");
}
1
  • 2
    Hola @omaza1990. Por favor intentemos prestar atención a la hora de crear nuevas etiquetas. En especial con meta-etiquetas como [tabla] que no definen en absoluto a la pregunta. Más información en ¿Qué son las etiquetas, y cómo debo usarlas?
    – Mariano
    el 4 jul. 2017 a las 20:00

1 respuesta 1

1

El problema es que estas ejecutando la funcion crearTabla y se los estas asignando a la propiedad onload de window : window.onload = crearTabla();.

Deberias asignarle la funcion y no el resultado: window.onload = crearTabla;

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.