Problema:Crear una tabla con dos filas y dos columnas cambiar el color del interior de la casilla cuando ingresamos con el mouse.
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Prueba</title>
</head>
<body>
<table border="1">
<tr>
<td>casilla 1,1</td>
<td>casilla 1,2</td>
</tr>
<tr>
<td>casilla 2,1</td>
<td>casilla 2,2</td>
</tr>
</table>
<script src="funciones.js"></script>
</body>
</html>
let vec = document.getElementsByTagName('td')
for (let f = 0; f < vec.length; f++) {
vec[f].addEventListener('mouseover', entroCasilla)
vec[f].addEventListener('mouseout', salioCasilla)
}
function entroCasilla(e) {
e.target.style.backgroundColor = '#ff0'
}
function salioCasilla(e) {
e.target.style.backgroundColor = '#fff'
}