How do I access DOM nodes from an array in javascript?

Question

I am trying to build a drop-down menu that will show a row to the side of it when you hover over one of the cells with the mouse. I'm really new with using the DOM, and javascript as well.

The problem I'm running into is that the array I have created doesn't seem to access what I thought it should. Is it just my syntax, or do I need to approach this differently? Here is my code:

window.onload = function () {
    var tableID = "strokerKitMenu";
    var table = document.getElementById(tableID);
    var tableRows = table.getElementsByTagName("tr");
    var tableCell = [];
    var counter = 0;
    for (i = 0; i < tableRows.length; i++) {
        tableCell[i] = new Array();
        tableCell[i].push(tableRows[i].getElementsByTagName("td"));
    }

    for (i = 0; i < tableCell.length; i++) {
        tableCell[0, i].style.display = "block"; //This doesn't compile
        alert(tableCell[0, i].Text); //This comes back "undefined"
        for (j = 1; j < tableCell[i].length; j++) //I haven't even tested this part yet
        {
            tableCell[i][j].onmouseover = function showCell() {
                tableCell[i][j + 1].style.display = "block";
            }
            tableCell[i][j].onmouseout = function hideCell() {
                this.style.display = "none";
            }
        } //end inner for loop
    } //end outer for loop
}

Please don't change your question to reflect the code given in an answer. It makes the answer obsolete and confusing. — user1106925
– user1106925, Commented Feb 23, 2012 at 18:18

Alexander Pavlov · Accepted Answer · 2012-02-23 18:07:55Z

1

tableCell[0, i].style.display="block";   //This doesn't compile

This syntax is invalid in JavaScript: you have specified two indices for tableCell but I guess you meant tableCell[0][i].style.display="block";

alert(tableCell[0, i].Text);             //This comes back "undefined"

Once you fix the first error, you will want to change this to tableCell[0][i].textContent.

answered Feb 23, 2012 at 18:07

Alexander Pavlov

32.4k5 gold badges71 silver badges95 bronze badges

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

2 Comments

Riet Over a year ago

I tried what you suggested, but I'm still getting the same errors. Other thoughts?

Alexander Pavlov Over a year ago

What is "same errors"? "Doesn't compile" and "undefined value"? Did you try any debugger? (Chrome Developer Tools or Firebug)

Raynos · Accepted Answer · 2012-02-23 18:20:02Z

0

tableCell[i].push.apply(tableCell[i], tableRows[i].getElementsByTagName("td"));

You don't want to push the single array in. You want to push all the elements in. Otherwise you would have to access them as tableCell[i][0][j]

answered Feb 23, 2012 at 18:20

Raynos

170k57 gold badges359 silver badges399 bronze badges

1 Comment

Alexander Pavlov Over a year ago

How come tableRows is a 2D array?

Collectives™ on Stack Overflow

How do I access DOM nodes from an array in javascript?

2 Answers 2

2 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related