0
142
VistasOrdene una tabla html creada dinámicamente usando JavaScript como el juego de serpientes y escaleras
He creado una tabla usando javascript y HTML. La tabla tiene 50 celdas. Las celdas comienzan en 50 y terminan en 1. Así es como se ve ahora y mi código:
Estoy creando un juego de serpientes y escaleras. Entonces, 1 debe comenzar en la esquina inferior izquierda y así sucesivamente:
¿Hay alguna manera de hacer esto fácilmente o necesito programar cada fila yo mismo como quiero?
Este es mi código hasta ahora:
HTML:
<html> <head> <script> var link = document.createElement('link'); link.rel = 'stylesheet'; link.type = 'text/css'; link.href = 'style.css'; document.getElementsByTagName('HEAD')[0].appendChild(link); </script> </head> <html lang="en"> <body> <div> <button id="selectbtn" type="button" >Create </button> <button id="btnMove" type="button" >move to ?</button> </div> <div id="myDynamicTable"> </div> </body> </html>Guion:
document.getElementById("selectbtn").addEventListener("click", addTable); function addTable() { document.getElementById("selectbtn").hidden=true; var myTableDiv = document.getElementById("myDynamicTable"); var table = document.createElement('TABLE'); table.border='1'; //table.className = "table"; var tableBody = document.createElement('TBODY'); table.appendChild(tableBody); var n = 50; var even = true; for (var i=0; i<5; i++){ var tr = document.createElement('TR'); tableBody.appendChild(tr); for (var j=0; j<10; j++){ var td = document.createElement('TD'); td.width='75'; td.height = '75'; td.id = n; if(even){ td.className = "even" even = false } else{ td.className = "odd" even = true } var img = document.createElement('img'); img.id = "img"+n; td.appendChild(img); td.appendChild(document.createTextNode(n)); tr.appendChild(td); n--; } } myTableDiv.appendChild(table); }Gracias de antemano
·
Juan Pablo Isaza
Responde la pregunta