¡Hola!
Estaba intentando crear un generador de imagenes al azar con 5 divs flotantes.
Encontré por ahí un código que genera el número,y funciona muy bien.El problema es que al asignar en el bucle el nombre en una variable,me da este problema:
"document.getElementById(cuadrado) is null"
¿Alguien sabe que es lo que le pasa al código?
Aqui está el código simplificado a 6 imágenes:
Código Javascript
:
Ver original<!DOCTYPE html>
<html>
<head>
<title>Menu contextual</title>
<link rel="stylesheet" href="g2.css" type="text/css" />
<script type="text/javascript">
for(var i = 1; i <= 4; i++){
var iSuperior = 4;
var dResult = Math.random();
dResult = Math.floor(dResult * (iSuperior + 1));
//var cuadrado = String("d" + dResult);
var cuadrado="'d"+ dResult +"'";
switch(dResult){
case 0:
var imprimir="<img width='200' height='150' src='2cia6ic.gif'/>"
document.getElementById(cuadrado).innerHTML= imprimir;
break;
case 1:
var imprimir="<img width='200' height='150' src='966cfcff1a83a6ce3eb7abac493c87e9.gif'/>"
document.getElementById(cuadrado).innerHTML= imprimir;//document.getElementById(cuadrado).src="966cfcff1a83a6ce3eb7abac493c87e9.gif";
break;
case 2:
var imprimir="<img width='200' height='150' src='12663d2a1c1fba67cf007be.gif'/>"
document.getElementById(cuadrado).innerHTML= imprimir;
//document.getElementById(cuadrado).src="12663d2a1c1fba67cf007be.gif";
break;
case 3:
var imprimir="<img width='200' height='150' src='97ad6f9782f8090599ee0a2.gif'/>"
document.getElementById(cuadrado).innerHTML= imprimir;
//document.getElementById(cuadrado).src="97ad6f9782f8090599ee0a2.gif";
break;
case 4:
var imprimir="<img width='200' height='150' crc='bfff33331089fc046d0efa1.gif'/>"
document.getElementById(cuadrado).innerHTML= imprimir;
//document.getElementById(cuadrado).src="bfff33331089fc046d0efa1.gif";
break;
case 6:
var imprimir="<img width='200' height='150' src='d777c8de014bfb21d3647ff.gif'/>"
document.getElementById(cuadrado).innerHTML= imprimir;
//document.getElementById(cuadrado).src="d777c8de014bfb21d3647ff.gif";
break;
default:
document.getElementById(cuadrado).src="966cfcff1a83a6ce3eb7abac493c87e9.gif";
break;
}
</script>
</head>
<body>
<div id="d0" style="width:200px; float:left;"><img id="dd0" value="1" width="200" height="150"/></div>
<div id="d1" style="width:200px; float:left;"><img id="dd1" value="1" width="200" height="150"/></div>
<div id="d2" style="width:200px; float:left;"><img id="dd2" value="1" width="200" height="150"/></div>
<div id="d3" style="width:200px; float:left;"><img id="dd3" value="1" width="200" height="150"/></div>
<div id="d4" style="width:200px; float:left;"><img id="dd4" value="1" width="200" height="150"/></div>
</body>
</html>
Tambien probé con .src en la etiqueta imagen,pero me daba el mismo error.
¿Que es lo incorrecto en el InnerHTML?¿Alguna sugerencia?
¡Gracias de antemano por la respuesta!