[总结]获得控件的方法

最新推荐文章于 2025-12-27 11:46:02 发布

原创最新推荐文章于 2025-12-27 11:46:02 发布 · 1.1k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#input #table #html #border #action

本文介绍了通过不同方法获取HTML表单元素值的技巧，包括使用表单名称、元素ID、元素名称及类型等，适用于前端开发人员学习与参考。

<html>

<head>

<!--

text-decoration: none;

color: #000000;

}

-->

</style>

</head>

<tr>

<td width="20%">input1</td>

<td width="18%">input2</td>

</tr>

<tr>

<td>input3</td>

<td>input3</td>

</tr>

<tr>

黑

白</td>

</tr>

<tr>

<td align="center">存在相同input时(input3)</td>

</tr>

<tr>

<td><a href="####" onClick="alert(document.form1.input1.value);">(document.)form1.input1.value</a></td>

<td colspan="2">呵呵，最常用的。(document.)可以省去</td>

<td>undefined</td>

</tr>

<tr>

<td><a href="####" onClick="alert(document.all.input1.value);">document.all.input1.value</a></td>

<td>undefined</td>

</tr>

<tr>

<td><a href="#" onClick="alert(document.getElementById('input1').value);">document.getElementById('input1').value</a></td>

<td colspan="2">ID名可以动态合成，适合ID名规则变化的</td>

<td>返回第一个input的值</td>

</tr>

<tr>

<td><a href="#" onClick="alert(document.getElementsByName('input3')[0].value);">document.getElementsByName("input3")[0].value</a></td>

<td colspan="2">返回相同名字控件的数组</td>

</tr>

<tr>

<td><a href="#" onClick="alert(document.getElementsByTagName('input')[0].value);">document.getElementsByTagName('input')[0].value</a></td>

<td colspan="2">返回相同类型控件的数组</td>

</tr>

<tr>

<td><a href="###" onclick="alert(document.getElementsByTag('table'));">document.getElementsByTag('input')[0].value</a></td>

</tr>

<tr>

</tr>

<tr>

</tr>

<tr>

</tr>

<tr>

</tr>

</table>

</form>

</html>

一、getElementsByName("aa") 取得具有name属性为aa的所有元素,返回的是数组
getElementsByTag 不知道
getElementsByTagName("select") 取得所有标签名为select的元素,返回的是数组
getElementsById("dd") 取得具有id属性为aa的元素,返回的是一个元素,如果id为aa的元素有好多的话则返回第一个

二、document.form["n1"].value