JavaScript：如何访问表第二行中的文本框

Question

I have an html code like this -

<table border="0" cellspacing="2" cellpadding="2" width="99%" id="subAccTable">
        <tr>
               <h2>Sub Accounts</h2>
        </tr>
        <tr>
            <th>action </th>
            <th>account</th>
            <th>homeDir</th>
            <th>primaryGroup</th>
        </tr>
    <tr>
        <td><input type="hidden" name="vtierId" value="" /></td>
        <td><input type="text" name="subAcc"
                value=""/></td>
            <td><input type="text" name="subHomeDir"
                value=""/></td>
            <td><input type="text" name="subPriGroup"
                value=""/></td>
    </tr>
</table>

Now i want to fill the values of textboxes named subAcc, subHomeDir, subPriGroup using javascript. How can i do it ?

Answer 1

There are multiple ways to get the proper DOMElement; including:

• Giving each element an id and getting it using document.getElementById
• Using document.getElementsByName . This is not preferred since there can be multiple elements with the same name, however there can be only one with the same id.
• Using the form directly. For example if your form's name is form1: form1.subAcc
• Using document.getElementsByTagName('input') and then getting the proper index.

I'd recommend using the id to retrieve the proper element.

Answer 2

The easiest way would be to give these textboxes a unique id, then reference them like this:

<input type="text" id="subHomeDir" name="subHomeDir" value=""/>

var tb = document.getElementById("subHomeDir");
tb.value = "foo";

---

If you're stuck with the names only, then you can use document.getElementsByName , just remember, this will return a collection of elements (since names are not necessarily unique), which you'll have to index:

var tb = document.getElementsByName("subHomeDir")[0];
tb.value = "foo";