在表单提交中发送数据时使用name属性。不同的控件响应不同。例如，您可能有几个具有不同id属性的单选按钮，但相同的name。提交时，响应中只有一个值-您选择的单选按钮。

当然，还有更多的东西，但它肯定会让你朝着正确的方向前进。

为表单控件使用name属性（例如<input>和<select>），因为这是表单提交时发生的POST或GET调用中使用的标识符。

每当您需要使用CSS、JavaScript或一个片段标识符处理特定的超文本标记语言元素时，请使用id属性。也可以按名称查找元素，但按ID查找它们是更简单，更可靠。

以下是一个简短的总结：

• id用于通过Document识别超文本标记语言元素对象模型（通过JavaScript或使用CSS样式）。id预计在页面中是唯一的。

• name对应于形式元素，标识发布的内容返回服务器。

下面的论坛主题对相同的基本问题有答案，但基本上，id用于脚本识别，姓名用于服务器端。

超文本标记语言控件的id与name属性

ID标签-由CSS使用，定义div、跨度或其他元素的独特实例。出现在JavaScript DOM模型中，允许您通过各种函数调用访问它们。

字段的姓名标记-这是每个形式唯一的-除非您正在执行要传递给PHP/服务器端处理的数组。您可以通过名称通过JavaScript访问它，但我认为它不会在DOM中显示为节点，或者可能会有一些限制（例如，如果我没记错的话，您不能使用. innerHTML）。

见id=vs name=：

有什么区别？简短的回答是，两者都用，不要担心。但是如果你想理解这种愚蠢，这里是瘦：

id=用于像这样的目标：<some-element id="XXX"></some-element>用于像这样的链接：<a href="#XXX"。

当您在表单中点击提交时，name=还用于标记使用HTTP（超文本传输协议）GET或POST发送到服务器的消息中的字段。

id=标记JavaScript和JavaDOM（文档对象模型）使用的字段。name=中的名称在表单中必须是唯一的。id=中的名称在整个文档中必须是唯一的。

有时name=和id=名称会有所不同，因为服务器希望同一文档中的各种表单或上面示例中相同表单的各种单选按钮具有相同的名称。id=必须是唯一的；name=不能。

JavaScript需要唯一的名称，但是这里已经有太多没有唯一名称=名称的文档了，所以W3的人发明了需要唯一的id标记。不幸的是，旧的浏览器不理解它。所以你需要表单中的两种命名方案。

说明：HTML5中不支持<a>等某些标签的属性“名称”。

name对于链接目标已弃用，在HTML5中无效。它至少在最新的Firefox（v13）中不再起作用。将<a name="hello">更改为 <a id="hello">。

目标不需要是<a>标记。它可以是<p id="hello">或<h2 id="hello">等，这通常是更干净的代码。

正如其他帖子所说，name仍然在表单中使用（需要）。它也仍然在META标签中使用。

我思考和使用它的方式很简单：

id用于CSS和JavaScript/jQuery（它在页面上必须是唯一的）。

当通过超文本标记语言提交表单时，姓名用于服务器上的表单处理（它必须在表单中是唯一的-在某种程度上，请参阅下面的保罗注释）。

如果您不使用表单自己的提交方法向服务器发送信息（而是使用JavaScript），您可以使用姓名属性将额外信息附加到输入-就像将其与隐藏的输入值配对一样，但它看起来更整洁，因为它被合并到输入中。

这个位目前在Firefox中仍然有效，尽管我想将来它可能不会被允许通过。

您可以有多个具有相同名称值的输入字段，只要您不打算以老式的方式提交。

<form action="demo_form.asp"><label for="male">Male</label><input type="radio" name="sex" id="male" value="male"><br>
<label for="female">Female</label><input type="radio" name="sex" id="female" value="female"><br>
<input type="submit" value="Submit"></form>

下面是id属性的有趣用法。它在

 <form action="action_page.php" id="form1">First name: <input type="text" name="fname"><br><input type="submit" value="Submit"></form>
<p>The "Last name" field below is outside the form element, but still part of the form.</p>Last name: <input type="text" name="lname" form="form1">

一般来说，假设name总是被id取代。这在某种程度上是正确的，但实际上并不适用于表单字段和框架名称。例如，对于表单元素，姓名属性用于确定要发送到服务器端程序的名称-值对，不应被消除。浏览器不会以这种方式使用id.为了安全起见，您可以在表单元素上使用姓名和id属性。所以，我们会写以下内容：

<form id="myForm" name="myForm"><input type="text" id="userName" name="userName" /></form>

为了确保兼容性，在定义姓名和id属性值时具有匹配的属性值是一个好主意。但是，要小心-一些标签，特别是单选按钮，必须具有非唯一的姓名值，但需要唯一的id值。

同样，这应该参考id不仅仅是姓名的替代品；它们的目的不同。此外，不要忽视旧式方法，深入研究现代库会发现有时出于性能和简化目的使用了这种语法风格。你的目标应该始终是支持兼容性。

现在在大多数元素中，姓名属性已经被弃用，取而代之的是更普遍的id属性。然而，在某些情况下，特别是表单字段（<button>、<input>、<select>和<textarea>），姓名属性仍然存在，因为它仍然需要设置表单提交的名称-值对。此外，我们发现一些元素，特别是框架和链接，可能会继续使用姓名属性，因为它在按名称检索这些元素时通常很有用。

id和姓名之间有明显的区别。通常，当姓名继续时，我们可以将值设置为相同。然而，id必须是唯一的，在某些情况下，姓名不应该-想想单选按钮。可悲的是，id值的唯一性，虽然被标记验证捕获，但并不像它应该的那样一致。浏览器中的CSS实现将为共享id值的对象设置样式；因此，我们可能不会在运行时之前捕获可能影响我们JavaScript的标记或样式错误。

这是托马斯-鲍威尔的书JavaScript-完整参考。

ID：

1. 它用于通过文档对象模型（DOM）（通过JavaScript或CSS样式）识别超文本标记语言元素。
2. id在页面中是唯一的。

姓名对应于表单元素并标识返回到服务器的内容。

示例：

<form action="action_page.php" id="Myform">First name: <input type="text" name="FirstName"><br><input type="submit" value="Submit"></form>
<p>The "Last name" field below is outside the form element, but still part of the form.</p>Last name: <input type="text" name="LastName" form="Myform">

姓名 vs.id

姓名

• 元素的名称。例如，服务器用于标识表单中的字段提交。
• 支持元素是<button>、<form>、<fieldset>、<iframe>、<input>，<keygen>，<object>，<output>，<select>，<textarea>，<map>，<meta>和<param>
• 名称不必是唯一的。

id

• 通常与CSS一起使用来设置特定元素的样式。这个值属性必须是唯一的。
• Id是一个全局属性。全局属性可以用于所有元素，尽管属性可能对某些元素没有影响。
• 在整个文档中必须是唯一的。
• 此属性的值不能包含空格，与此相反class属性，它允许用空格分隔值。
• 使用除ASCII字母和数字之外的字符，'_ ', '-' 和'。可能会导致兼容性问题，因为它们在超文本标记语言4中是不允许的。虽然这一限制在超文本标记语言5中被取消，但ID应该开始用一个字母来兼容。

表单输入元素的ID与元素中包含的数据无关。ID用于将元素与JavaScript和CSS挂钩。但是，name属性在浏览器向服务器发送的HTTP请求中用作与value属性中包含的数据关联的变量名。

例如：

<form><input type="text" name="user" value="bob"><input type="password" name="password" value="abcd1234"></form>

提交表单时，表单数据将包含在HTTP标头中，如下所示：

如果您添加ID属性，它不会更改HTTP标头中的任何内容。它只会让它更容易与CSS和JavaScript挂钩。

ID用于唯一标识元素。

姓名用于表单。尽管您提交了一个表单，但如果您没有提供任何名称，则不会提交任何内容。因此表单元素需要一个名称才能通过“get或ush”等表单方法进行标识。

只有具有姓名属性的才会出去。

根据个人经验并根据W3学校属性描述：

ID是全局属性，适用于超文本标记语言中的几乎所有元素。它用于唯一标识网页上的元素，其值主要从前端访问（通常通过JavaScript或jQuery）。

姓名是对超文本标记语言中的特定元素（如表单元素等）有用的属性，其值大多发送到后端进行处理。

超文本标记语言属性参考

id和姓名之间没有文字上的区别。

姓名是一个标识符，在浏览器发送的HTTP请求中用作与元素value属性中包含的数据关联的变量名。

另一方面，id是浏览器、客户端和JavaScript的唯一标识符。因此，表单需要id，而其元素需要姓名。

id更具体地用于向唯一元素添加属性。在DOM方法中，id在JavaScript中用于引用您希望对其执行操作的特定元素。

例如：

<html>
<body><h1 id="demo"></h1>
<script>document.getElementById("demo").innerHTML = "Hello World!";</script></body>
</html>

同样可以通过name属性实现，但最好在表单中使用id，在输入标记或选择标记等小表单元素中使用姓名。

id会给元素一个id，所以一旦你编写了真正的代码，（像JavaScript一样）你就可以使用id来读取元素。name只是一个名称，所以用户可以看到元素的名称，我想。

示例：

<h1 id="heading">text</h1><script>document.getElementById("heading"); // Reads the element that has the id "heading".</script>

// You can also use something like this:document.getElementById("heading").value; // Reads the value of the selected element.

<body><form action=""><label for="username">Username</label><input type="text" id="username" name="username"><button>Submit!</button></form></body>

正如我们在这里看到的，“id”和“for”元素是相互连接的。如果您单击标签（用户名），则输入字段将突出显示（这对移动用户很有用，被认为是一种很好的做法）。

另一方面，“名称”元素在提交表单时很有用。无论您在输入字段中输入什么，它都将显示在URL上。请参阅附加图像。

在这个问题出现的所有时间里，我很懊恼（也许有点难过），因为没有人想过提到可访问性，尽管它总是很重要，但它一直在管理和软件工程师中稳步获得支持（仅从我个人的观察来看；没有确凿的数据来支持这一点）。

我可以提供的一个统计数据是（来源）：

因此，对无障碍缺陷的认识呈现出稳步增长的趋势。同一参考文献提到，从这些数字中，人们可以观察到至少有一起诉讼被提起每小时！

那么，可访问性如何权衡name与id呢？

根据万维网联盟（W3C）：

标签的for属性必须与标签的id完全匹配表单控制。