HTML基础之id与name的区别

id：是唯一标识符，不允许重复，可以通过它的值来获得对应的html标签对象。id 在 HTML 文档中必须是唯一的。

name：是可以重复的，name用于对提交到服务器后的表单数据进行标识，或者在客户端通过 JavaScript 引用表单数据。只有设置了 name 属性的表单元素才能在提交表单时传递它们的值。

id与name的区别

• 就像在超市的商品中，名为巧克力的商品有很多，但是去柜台付钱时只能根据唯一不变的条纹码去识别这个巧克力具体是哪个巧克力。而这里的巧克力类似于HTML标签里的name标签，条纹码类似HTML标签里的id标签。

id与name的区别.png

id与name的用法

id：

• 用来定义CSS的样式。
• 在脚本中获取对象。
  例子

<input id="className" type="text">
//在脚本中获得输入的内容，可以直接用className.value来获取。
//如果用DOM的话，则用document.getElementById("className").value来获取。

name：

• 作为表单的控件名。表单提交的数据都用控件的name而不是id来控制，因为有许多name会同时对应多个控件，比如checkbox和radio，而id必须是全文档中唯一的。此外浏览器会根据name来设定发送到服务器的request。因此如果用id，服务器是无法得到数据的。
• 在脚本中通过getElementByName("name")去获取值。

只能用Id的情况：

• label和form控件的关联

<label   for="className">className</label>
<input   id="className"   type="text">
//for属性指定与label关联的元素的id，不可用name替代。

• CSS定义样式时，只能以#MyId去指定样式的元素，不能用name去替代。
• 脚本获取对象时，如果使用name的话，通常先得到包含控件的form，例如document.forms[0]，然后从form再引用name，但是要注意的是这样得到的是经过计算后将发送给服务器的值。