<head> <script type="javascript/css"> var die1Image,die2Image,die3Image,die4Image; function start(){ var button=document.getElementById("rollButton"); button.addEventListener("click",rollDice,false); die1Image=document.getElementById("die1"); die2Image=document.getElementById("die2"); die3Image=document.getElementById("die3"); die4Image=document.getElementById("die4"); } function rollDice(){ setImage(die1Image); setImage(die2Image); setImage(die3Image); setImage(die4Image); } function setImage(dieImg){ var dieValue=Math.floor(1+Math.random()*6); dieImg.setAttribute("src","die"+dieValue+".png"); dieImg.setAttribute("alt","die image with "+dieValue+" spot(s)"); } window.addEventListener("load",start,false); </script> </head> <body> <form action="#"> <input id="rollButton" type="button" value="Roll Dice"> </form> <ol> <li><img id="die1" src="blank.png" alt="die 1 image"></li> <li><img id="die2" src="blank.png" alt="die 2 image"></li> <li><img id="die3" src="blank.png" alt="die 3 image"></li> <li><img id="die4" src="blank.png" alt="die 4 image"></li> </ol> </body>cada vez que hago clic en el botón de rollo, las fotos en blanco.png permanecen y las fotos no se muestran en sus lugares. las imágenes de los dados se nombran (die1.png->die6.png) correctamente.
<script type="text/javascript"> y no "javascript/css"