访问表td内的html select元素

Question

I have the following html snippet

<table>
    <tr>
        <td><select name="day">
        </select></td>
        <td><select name="time">
        </select></td>
        <td><select name="closed" onchange="dosomething(this)">
        </select></td>
    </tr>
</table>

When i change something on , then i would like to get a handle to and do some operation on it. How do i get a handle to in javascript?

function closedChanged(object)
{
    try
    {
        var parent=object.parentNode.parentNode;
        var day = parent.getElementsByName("day")[0];
    }
    catch(e)
    {
        alert(e);
    }
}

Here i am getting error saying that HTMLTableRowElement does not have method called getElementsByName. Any other way?

Answer 1

对于此特定问题，您不应按其名称访问DOM元素，而应按其ID访问它们。

foo = document.getElementById("someID"); //Its unique

Answer 2

You could also try getting all select elements, looping through them and checking their name:

var parent = obj.parentNode.parentNode;
var selects = parent.getElementsByTagName("select");
for (var i = 0; i < selects.length; i++) {
    if (selects[i].name == "day") {
        // selects[i] is the target
    }
}

I'm sure it's similar to what document.getElementsByName() does but not searching by tag first.

Answer 3

The getElementsByName() method accesses all elements with the specified name.

As you given different name for each select you can access it directly.

var x=document.getElementsByName("day");

no need of parent