Uncaught TypeError: Cannot call method 'getAttribute' of undefined

[nyuszi]

hi i get an error while i trying to do a plumber game here is the javascript code:
error message: Uncaught TypeError: Cannot call method 'getAttribute' of undefined (line 34)

the problem:

function check ()
{

    kepek = document.getElementsByTagName("img");
    cellak = document.getElementsByTagName("td");
    db = 0;
    for (i=1; i<cellak.length; i++)
        {
            if ((cellak[i].getAttribute("id")) != (kepek[i-1].getAttribute("id")))
            {
            db++;
            }
        }
        if (db == 0)
        {
        pontszam = pontszam + mp * 10 + 6 * 100 - klikk * 10;
        $("pont").innerHTML = pontszam;
        }

}

whole code:

window.onload = function()
{
    pontszam = 0;
    klikk = 0;
    $("uj").onclick = newgame;
    $("kesz").onclick = check;
    kepek = document.getElementsByTagName("img");
    for (i=0; i<kepek.length; i++)
        {
            kepek[i].onclick = click;
        }
}

function newgame ()
{
    kepek = document.getElementsByTagName("img");
    for (i=0; i<kepek.length; i++)
        {
            kepek[i].onclick = click;
        }
    $("p1").style.display = "block";
    mp = 40;
    idok = setInterval("csok1();",1000);
}

function check ()
{

    kepek = document.getElementsByTagName("img");
    cellak = document.getElementsByTagName("td");
    db = 0;
    for (i=1; i<cellak.length; i++)
        {
            if ((cellak[i].getAttribute("id")) != (kepek[i-1].getAttribute("id")))
            {
            db++;
            }
        }
        if (db == 0)
        {
        pontszam = pontszam + mp * 10 + 6 * 100 - klikk * 10;
        $("pont").innerHTML = pontszam;
        }

}

function click(e)
{
    klikk++;
    if (e.target.getAttribute("id") == "fl")
    {
        e.target.setAttribute("id","jb");
        e.target.setAttribute("src","bead\\images\\jb.png");
    }
    else if (e.target.getAttribute("id") == "jb")
    {
        e.target.setAttribute("id","fl");
        e.target.setAttribute("src","bead\\images\\fl.png");
    }
    if (e.target.getAttribute("id") == "jl")
    {
        e.target.setAttribute("id","jf");
        e.target.setAttribute("src","bead\\images\\jf.png");
    }
    else if (e.target.getAttribute("id") == "jf")
    {
        e.target.setAttribute("id","bf");
        e.target.setAttribute("src","bead\\images\\bf.png");
    }
    else if (e.target.getAttribute("id") == "bf")
    {
        e.target.setAttribute("id","bl");
        e.target.setAttribute("src","bead\\images\\bl.png");
    }
    else if (e.target.getAttribute("id") == "bl")
    {
        e.target.setAttribute("id","jl");
        e.target.setAttribute("src","bead\\images\\jl.png");
    }

}

function a ()
{
    $("p2").style.display = "block";
    mp2 = 50;
    idokk = setInterval("csok2();",1000);

}

function b ()
{
    $("p3").style.display = "block";
    mp3 = 60;
    idokkk = setInterval("csok3();",1000);

}

function csok1()
{

    mp--;
    //alert(mp2);
    $("csik").style.width = (mp*6.2) + "px";
        if (mp == 0)
    {
        clearTimeout(idok);
        $("valami").innerHTML = "THE END";
    }
    }

function csok2()
{

    mp2--;
    //alert(mp2);
    $("csik2").style.width = (mp2*8.9) + "px";
        if (mp2 == 0)
    {
        clearTimeout(idokk);
        $("valami2").innerHTML = "THE END";
    }
    }

function csok3()
{

    mp3--;
    //alert(mp2);
    $("csik3").style.width = (mp3*7.41) + "px";
        if (mp3 == 0)
    {
        clearTimeout(idokkk);
        $("valami3").innerHTML = "THE END";
    }
    }


function $(m)
{
return document.getElementById(m);
}

can you tell me what is the problem? kepek is the images what i use they all have id and i set all TD an id too but the check dont want to work :(

thank you
Nyuszi(Rabbit)

can you tell me what is the problem? kepek is the images what i use they all have id and i set all TD an id too but the check dont want to work :(

@nyuszi

Why i-1? Can't you leave it just i:

from this:

if ((cellak[i].getAttribute("id")) != (kepek[i-1].getAttribute("id")))

to this:

if ((cellak[i].getAttribute("id")) != (kepek[i].getAttribute("id")))

I think that will work. Why did you put i-1?

[ryantroop]

only thing I can think of is that cellak does not contain any elements, and since you are starting at 1 you are essentially doing:

null.getAttribute("id");

I don't know why you are doing it that way anyhow since id is a directly accessable property.

edit: alternately, since you initially did "i=1" instead of "var i=1" for the for loop, you may have caused a problem with a global variable and lost yourself in scope.

maybe try:

function check ()
{
    //note inclusion of "var" -- otherwise you are making globals.
    var kepek = document.getElementsByTagName("img");
    var cellak = document.getElementsByTagName("td");
    var db = 0;
    for (var i=1; i<cellak.length; i++)
        {
            if (cellak[i])
                {
                    if ((cellak[i].id) != (kepek[i-1].id))
                    {
                      db++;
                    }
                }
        }

        if (db == 0)
        {
            pontszam = pontszam + mp * 10 + 6 * 100 - klikk * 10;
            $("pont").innerHTML = pontszam;
        }

}

note the added "var" before your variables (and, I encourage you to do this to all variables when you instantiate them; global or not).

Also, note the check to see if the item exists first before acting upon it.

Good luck,

Ryan