problems with getting the Element

Question

i have a picture the is setting on the event onload :

function hideMe() {

        document.getElementById("navy1").style.display = "none";  
    }

and i have another function that setting the picture on the screen:

    function setUpPicture() {

        subRunnerOBJ = new Object();
        subRunnerOBJ.topPos = 100;
        subRunnerOBJ.leftPos = 0;
        subRunnerOBJ.velX = 400;
        subRunnerOBJ.velY = 0;
        subRunnerOBJ.score = 0;



        snImgObj = document.getElementById("navy1");

//in this point im getting the messge "Microsoft JScript runtime error: Unable to get value of the property 'style': object is null or undefined"

        snImgObj.style.left = subRunnerOBJ.leftPos + "px";
        snImgObj.style.top = subRunnerOBJ.topPos + "px";
        snImgObj.style.position = "absolute";
        snImgObj.style.display = "show";

        startMovePicture();

any idea why this happan?

 //this one will set the the pictue on the right side of the screen
    function setUpPicture() {

        subRunnerOBJ = new Object();
        subRunnerOBJ.topPos = 100;
        subRunnerOBJ.leftPos = 0;
        subRunnerOBJ.velX = 400;
        subRunnerOBJ.velY = 0;
        subRunnerOBJ.score = 0;


        //document.getElementById("navy1").style.display = "show";
        snImgObj = document.getElementById("navy1");
        snImgObj.style.left = subRunnerOBJ.leftPos + "px";
        snImgObj.style.top = subRunnerOBJ.topPos + "px";
        snImgObj.style.position = "absolute";
        snImgObj.style.display = "show";
        //once we place the location of the sub , we will Call to new function that will move it
        startMovePicture();



    }
    function startMovePicture() {

        dt = 50; // in miliseconds
        h = setInterval("moveObj(subRunnerOBJ)", dt);

    }


    function moveObj(someObj) {
        counter = 0;



        while (counter < 3000) {

            subRunnerOBJ.leftPos = subRunnerOBJ.leftPos + subRunnerOBJ.velX * dt / 1000;
            subRunnerOBJ.topPos = subRunnerOBJ.topPos + subRunnerOBJ.velY * dt / 1000;

            snImgObj.style.left = subRunnerOBJ.leftPos + "px";
            snImgObj.style.top = subRunnerOBJ.topPos + "px";

            counter = counter + 50;

            if (counter == 3000) {

                stopRunning()

            }

        }

    }

    function stopRunning() {

        clearInterval(h);
        hideMe();
    }

    //this function will hide the pucture on liad , and once the loop with the Pictue Running will end
    //once loading the page we will not see the Picture 
    function hideMe() {

        document.getElementById("navy1").style.display = "none";  
    }



    }

is this [tag:java] or [tag:javascript]? – secretformula Jun 18 '12 at 23:02 — secretformula, Jun 18 '12 at 23:02
Show us the full code, something here isn't possible. – gdoron Jun 18 '12 at 23:05 — gdoron, Jun 18 '12 at 23:05

score 1 · Answer 1 · edited May 23 '17 at 11:55

Unable to get value of the property 'style': object is null or undefined"

This means that you are trying to use a property of an object while that object is actually a null or undefined value. In your case snImgObj is null.

This happens because the following code is unable to find an element with id "navy1"

snImgObj = document.getElementById("navy1"); // snImgObj is NULL in your case

There can be many reasons for this:

Your element simply doesn't exist.
You have forgotten to set the id or misspelled the id declaration.
You create the element after trying to get it by id.
Your element exists, but has not finished loading yet.
... etc.

If you intended to create an element by using getElementById, you should use the following approach instead:

var element = document.createElement('div'); // creates a dangling DOM node
someOtherElement.appendChild(element); // appends it to another element

It seems that older versions of Internet Explorer do not allow to create images in this way, but you can read this answer to see how it can be done in cross-browser way.

Also

The CSS display property does not understand "show". You probably want to set it to "block" instead. See documentation for display property.
```
snImgObj.style.display = "block"; // this is valid
```
Always use var when declaring variables! You are polluting the global scope.
Don't pass a string to setInterval, it accepts functions.
Use JSLint to validate your code. It will tell you where most of your problems are. It's worth it!

score 0 · Answer 2 · answered Jun 18 '12 at 23:33

0

The problem is that snImgObj is not getting set to an element in setUpPicture(). Double-check your HTML.

answered Jun 18 '12 at 23:33

pete

24,141
4
37
51

problems with getting the Element

2 Answers2