TypeError: document.getElementById () é nulo [fechado]

Question

Dec 01, 2012, 12:06 AM

TypeError: document.getElementById () é nulo [fechado]

Eu estou tentando mudar a fonte de uma imagem quando uma das minhas funções é chamada de "switchTurn", mas não está funcionando e o firebug continua dizendo que é por causa disso:

TypeError: document.getElementById("turns") is null

document.getElementById('turns').src = x;

Eu não entendo, eu sou capaz de mudar a fonte de todas as minhas imagens, exceto aquela com o ID de "voltas". Alguém poderia me ajudar nisso?

HTML

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html>
<meta http-equiv="Content-type" content="text/html;charset=UTF-8">
<head>
    <link rel="stylesheet" type="text/css" href="default.css" />
    <script language="Javascript" src="default.js" ></script>
</head>
<body onload="DisplayPlayed()" onmousedown="return false">
    <div id="wrapper" onmousedown="return false">
        <div id="Bcards" onmousedown="return false">
            <img src="turnedcard.png" id="Bcard01"/>
            <img src="turnedcard.png" id="Bcard02"/>
            <img src="turnedcard.png" id="Bcard03"/>
            <img src="turnedcard.png" id="Bcard04"/>
            <img src="invisiblecard.png" id="Bcard05"/>
            <img src="invisiblecard.png" id="Bcard06"/>
            <img src="invisiblecard.png" id="Bcard07"/>
        </div>
        <div id="Pcards">
            <img src="turnedcard.png" id="Pcard01"/>
            <img src="turnedcard.png" id="Pcard02"/>
            <img src="turnedcard.png" id="Pcard03"/>
            <img src="turnedcard.png" id="Pcard04"/>
            <img src="invisiblecard.png" id="Pcard05"/>
            <img src="invisiblecard.png" id="Pcard06"/>
            <img src="invisiblecard.png" id="Pcard07"/>
        </div>
            <img src="turnedcard.png" id="PlayedCards" onmousedown="return false"/>

            <img src="Down.png" id="turns" onmousedown="return false"/>
            <img src="Down.png" id="turns" onmousedown="return false"/>
    </div>
</body>
</html>

JavaScript

var Deck = [];
generateDeck();
var Numbers = [], Drew = 0, turn = false;
generateNumber();

function generateNumber(){
    do{
        Numbers[Drew] = Math.floor(Math.random() * 55);
    }while(Deck[Numbers[Drew]] === "|");
    Drew++;
    Numbers[Drew - 1] = 44;
    if(Numbers[Drew - 1] === 44 || Numbers[Drew - 1] === 45 || Numbers[Drew - 1] === 46 || Numbers[Drew - 1] === 47){
        switchTurn();
    }
}

function generateDeck(){
    for(i = 0; i < 56; i++){
        Deck[i] = i.toString();
    }
}

function discard(){
    Deck[Numbers[Drew]] = "|";
}

function switchTurn(){
    if(turn === true){
        arrowTurn("Up.png");
        turn = false;
    }else if(turn === false){
        arrowTurn("Down.png");
        turn = true;
    }
}

function arrowTurn(x){
    document.getElementById('turns').src = x;
}

function DisplayPlayed(){
    document.getElementById("PlayedCards").src = Deck[Numbers[Drew - 1]] + ".png";
    discard();
}