javascript dosnt seem to be working

Question

im trying to build a minesweeper in html and the javascript isnt woking

heres my html

    <!DOCTYPE html>
    <html>
<head>
    <link rel = "stylesheet" type = "text/css"
    href = "minesweeper.css" >
</head>
<body>
    <table id = "i" ></table>
    <script src = "minesweeper.js" ></script>
</body>
    </html>

here is the css

td{
border: 2px outset #000000;
width:25px;
height: 25px;
background-color: #cfcfcf;
  }

and here is the javascript (minesweeper.js)

   var gameBox = document.getElementById("i").innerHTML;
      console.log(gameBox);
     for ( var i = 0 ; i < 3 ; i++ ) {

gameBox += "<tr>";
console.log(gameBox);
for ( var j = 0 ; j < 3 ; j++ ) {
    gameBox += "<td id = '" /*+ i*/ + j + "'></td>";
}
gameBox += "</tr>";
    }

and all i get is a blank page

heres a link to the page http://borisute.com/geshem/2013/mkeller/minsweeper.html (it has some more code i didnt include b/c its not relevant to the above problem

Your JavaScript is executing before your `` and its elements have been rendered — Ian, Aug 14 '13 at 17:45
Your `script` is located before the `grid` element, so you're trying to select it before it exists. Move your script to the bottom of the page, just before the `
` tag. — , Aug 14 '13 at 17:45
Also, notice the list of questions under the ***Related*** category to the right. ===> — , Aug 14 '13 at 17:46
Don't just change your entire question like that. It makes all comments obsolete. But you're getting a blank page because you've not modified the page. The `gameBox` isn't holding a pointer to the `.innerHTML`. You need to assign to `.innerHTML` after the loop is done. — , Aug 14 '13 at 18:04
@CrazyTrain yeah I'm trying to figure out what the hell the people in the comments are talking about and I feel really stupid because i can't find any `grid` element in his code because he changed the question, lol. — gr3co, Aug 14 '13 at 18:06
im not sure i understand your reply are you telling me to after the loop place doc.getelementbyid("i).innerHTML = gameBox after the loop and delete the line b4 the loop? — Math chiller, Aug 14 '13 at 18:12
ok i got it working thnx and im srry again for not making new post and editing this 1 im kinda new here — Math chiller, Aug 14 '13 at 18:15

score 1 · Accepted Answer · answered Aug 14 '13 at 18:09

1

You still need to put the gamebox onside the html at the end of the script:

var gameBox = document.getElementById("i").innerHTML;
for ( var i = 0 ; i < 3 ; i++ ) {

    gameBox += "<tr>";
    for ( var j = 0 ; j < 3 ; j++ ) {
        gameBox += "<td id = '" + i + j + "'></td>";
    }
    gameBox += "</tr>";
        console.log(gameBox);
}
document.getElementById("i").innerHTML = gameBox;

answered Aug 14 '13 at 18:09

jdepypere

3,279
6
49
78

Would you really build up a `table` with this method in your own project? – Teemu Aug 14 '13 at 18:10
i fixed it put var gamebox = ""; b4 loop and document.getElementById("i").innerHTML = gameBox; after the loop and it works the way i wanted it 2 thnx guys 4 all the help and srry for messing up this is my first time here – Math chiller Aug 14 '13 at 18:26
I didn't check the code, I just answered what he asked. Nevertheless, I have already made a table using two `for` loops actually, and it was also in a minesweeper implementation in my js-early days. I did it like that so I could make the game in a single html page, and easily create different size fields. You are welcome @tryingToGetProgrammingStraight. – jdepypere Aug 14 '13 at 18:27

score 0 · Answer 2 · answered Aug 14 '13 at 18:28

You gamebox variable is nothing but this at the end of the for loop

<tr><td id = '0'></td><td id = '1'></td><td id = '2'></td></tr><tr><td id = '0'></td><td id = '1'></td><td id = '2'></td></tr><tr><td id = '0'></td><td id = '1'></td><td id = '2'></td></tr>

Also, you are not assigning to any element. You are only creating the variable.

javascript dosnt seem to be working

2 Answers2