关于Html的value和name

原创已于 2022-11-15 12:11:38 修改 · 1k 阅读

本内容遵循CC 4.0 BY-SA版权协议

于 2022-09-12 17:17:25 首次发布

本文详细探讨了HTML中value和name属性的使用。value属性并不总是与HTML内容相同，例如在button标签中两者无关，而在input的button类型中与显示文字对应。name属性主要用于标识元素，特别是在input的radio类型中，相同name实现单选效果，起到分组作用。

这两个属性并没有搞清楚细节，专门找了资料，总结一下。

value的细节

value属性实际上可以认为就是一个可以赋值的变量。
value有一个容易混淆的地方，就是认为value就是html标签的内容。
我直接说结论：有时是，有时不是。
我直接说结论：有时是，有时不是。
我直接说结论：有时是，有时不是。
例如下面的button，value的值和btn，中间的btn就没有关系，是互不影响的。

<button value="btn">btn<button/>

但是，我老有一种这两者是有关系的错觉。因为和另一个东西搞混了。就是input标签的button。
这个时候，value的值就和button上面的显示的文字是对应的了。
button这个标签是后面才出现，之前是没有的，之前只能用input实现button。

<input type="button" value="btn">

所以，value在input里面可能是和控件的内容是直接有关系的。但也有可能没关系。
比如radio。这里的男女两个字根本就不会显示，要显示就自己在input后面写上去。

<input type="radio" value="男"> 
<input type="radio" value="女">

总之，value有时和html的内容直接相关，有时又无关，只是单纯的作为一个值。
总之，value有时和html的内容直接相关，有时又无关，只是单纯的作为一个值。
总之，value有时和html的内容直接相关，有时又无关，只是单纯的作为一个值。

name的细节

首先dom里面是有一个叫getElementsByName的方法来专门查找元素的。所以name可以作为查找标识。再者在一些控件里面有特殊的用途，比如radio,如果你将多个radio设置了相同的name，radio才能实现单选的效果，不然默认还是单选。
所以，总的来说，name有种类似group的作用，就是分组的作用。

标签

#html #前端