Mi duda es por qué si pongo un índice en "document.getElementsByTagName('td')[0]" sí que pinta del color que marco, en cambio si no se lo pongo, no hace nada. Sin el índice no debería pintar cualquier "td" que seleccione?
Aquí dejo el código:
var elementoTable = document.createElement("tbody");
for (f = 0; f < 30; f++) {
var elementoTR = document.createElement("tr");
for (c = 0; c < 30; c++) {
var elementoTD = document.createElement("td");
elementoTR.appendChild(elementoTD);
}
elementoTable.appendChild(elementoTR);
}
document.getElementById("tablerodibujo").appendChild(elementoTable);
document.getElementById('tablerodibujo').addEventListener("click", colorear_amarillo, false);
function colorear_amarillo() {
document.getElementsByTagName('td')[0].style.backgroundColor = "#000";
}
td {
background-color: green;
width: 25px;
height: 25px;
}
tr {
width: 25px;
height: 25px;
}
<table id="tablerodibujo"></table>
document.getElementsByTagName('td')
?class
y le pones la clase a los que quieras coger ya que la clase se puede repetir?