Javascript recursive function variable null

Question

I'm trying to test out a simple recursive function to make a countdown timer. So far I have this javascript function:

setInterval(run_countdown("1"),1000);

function run_countdown(num) {
    var str = document.getElementById(num).innerHTML; 
    if(str === 0){
        str = 59;
        num = num + 1;
        run_countdown(num)
    } 
    var minus = str - 1;
    var res = str.replace(str,minus);
    document.getElementById(num).innerHTML=res;
    return;
};

and this is the markup in the browser:

<table border="0">
    <tbody>
        <tr>
            <td id="6">00</td>
            <td id="5">00</td>
            <td id="4">08</td>
            <td id="3">02</td>
            <td id="2">42</td>
            <td id="1">02</td>
        </tr>
        <tr>
            <th>Years</th>
            <th>Months</th>
            <th>Days</th>
            <th>Hours</th>
            <th>Minutes</th>
            <th>Seconds</th>
        </tr>
    </tbody>
</table>

When I run the page in the browser, I get an error in the consol saying "Uncaught TypeError: Cannot read property 'innerHTML' of null" for the very first getElementById. I did an alert on num and it seemed to be passing in ok. Not quite sure where I'm going wrong.

probably just a typo: ` <td id="p">02</td>` should probably be ` <td id="1">02</td>` — basilikum
– basilikum, Commented Jan 17, 2014 at 22:29
Before adding an answer, I'd just make sure you're running the javascript AFTER you're HTML is generated? — Dan H
– Dan H, Commented Jan 17, 2014 at 22:29

Preston S · Accepted Answer · 2014-01-17 22:37:05Z

2

as elchlanrs said, setInterval takes a function reference. Try

setInterval(function(){
  run_countdown("1");
}, 1000);

This will wait a full second before calling run_countdown("1"), presumably allowing your document to finish loading before execution which should fix the error.

answered Jan 17, 2014 at 22:37

Preston S

2,80126 silver badges38 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

jordan Over a year ago

that was my issue. Thanks!

Craig Curtis · Accepted Answer · 2014-01-17 22:40:52Z

1

You need to wait until your page has loaded:

document.onload = function() {
    setInterval(run_countdown("1"),1000);
}

answered Jan 17, 2014 at 22:40

Craig Curtis

86110 silver badges24 bronze badges

Collectives™ on Stack Overflow

Javascript recursive function variable null

2 Answers 2

1 Comment

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Linked

Related