深入理解input中的value、name、id的区别和用法——Web前端自学笔记

最新推荐文章于 2024-10-12 10:25:22 发布

来老铁干了这碗代码

最新推荐文章于 2024-10-12 10:25:22 发布

阅读量7.7k

点赞数 34

分类专栏： Web前端积累文章标签： java javascript js css

本文链接：https://blog.csdn.net/weixin_43899069/article/details/118303642

版权

积累同时被 2 个专栏收录

28 篇文章

订阅专栏

Web前端

24 篇文章

订阅专栏

本文详细解释了HTML中input控件的三个关键属性：value、name和id的区别及用途。value用于显示给用户看的控件值，name用于标识一组控件，而id则作为控件的唯一标识符。此外，还介绍了JavaScript中如何通过这两个属性来操作DOM元素。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

value：指该控件显示出来的值，是面向用户的。如<input type="button" value="123">这条语句运行出来时，button按钮上显示的数值就是123；

name：指一类控件的名称，可以重复。如<input type="button" name="123" value="提交">这条语句运行出来时，该按钮上显示的值为提交，该按钮的名字是123

id：指唯一区分控件的属性值，含义与name相同，不过id值是唯一的，而name允许重复。
即：

<input type="button" id="1" name="input" value="提交">
<input type="button" id="2" name="input" value="重置">
<input type="button" id="3" name="input" value="注册">

是合理的。

为什么要同时设置id和name呢？ 因为二者在JavaScript中有不同的用处。

当使用JavaScript时，如果我们只想获取一个控件对象，可以通过getElementById()来获取对应id的控件对象。

但我们若想获取一类对象，如获取所有的按钮控件对象，就可以通过getElementsByName()来获取对象数组。