Archief - [PROG][JAVASCRIPT] Child remove via DOM

Recipe4hate · 29 apr 2008

Hallo

Ik studeer sinds korte tijd javascript, maar het is me nog niet even duidelijk altijd. Ik probeer volgende oefening tot een goed einde te brengen:

We moeten 3 random afbeeldingen genereren wanneer er op een knop wordt geklikt. Wanneer deze 3 afbeeldingen identiek zijn, komt er een melding dat je gewonnen hebt, zo niet verloren.
Redelijk basic en alles lukt me goed, behalve dat wanneer ik voor de 2de keer op de knop klik, er 3 nieuwe afbeeldingen worden getekend, maar de oude niet verdwijnen. Mijn plan was dus om de <img> te verwijderen, net zoals ik hem creëerde. Dit deel snap ik echter niet zo goed...

Code:

<html>
<head>
    <title>Random jackpot</title>
</head>

<body>
    <div id="img">
    </div>
    <div id="button">
        <input type="button" value="speel" onclick="playGame()" />
    </div>
</body>

<script type="text/javascript">
    
    var x1;
    var x2;
    var x3;
    
    function playGame()
    {
        ini();
        returnResult();
    }
    function ini()
    {
        x1 = generateRandom();
        x2 = generateRandom();
        x3 = generateRandom();
        
        drawImg(x1);
        drawImg(x2);
        drawImg(x3);
    }
    function generateRandom()
    {
        return Math.ceil(Math.random() * 3);
    }
    function checkJackpot()
    {
        if(x1 == x2 && x2 == x3)
        {
            return true;
        }
        else
            return false;
    }
    function deleteDiv()
    {
        //iets als:
        //document.removeChild(document.getElementById("img").firstChild);
    }
    function drawImg(state)
    {
        var imgnode = document.createElement("img");
        
        imgnode.setAttribute("src", "bronmateriaal/pic/fig" + state + ".jpg");       
        document.getElementById("img").appendChild(imgnode);
        //document.write("<img src='bronmateriaal/pic/fig" + state + ".jpg' />");
    }
    function returnResult()
    {
        if (checkJackpot())
        {
            window.alert("U heeft gewonnen");
        }
        else   
            window.alert("U heeft verloren");
    }
    
</script>
</html>

kan iemand me een beetje verder helpen?

Bedankt!

Archief - [PROG][JAVASCRIPT] Child remove via DOM

Recipe4hate

Legacy Member