<input>标签中id和name的作用和区别

一、作用：

ID是以 #定义的CSS样式，也可以用JS获取来控制 getElementById(这里是ID) 来获取；

name就是给当前标签或元素指定名称，也可以用JS来控制值，form提交后获取的时候就需要获取name名称。

二、区别：

1、含义不同：

id要符合标识的要求，比如大小写敏感，最好不要包含下划线(因为不兼容CSS)。而name基本上没有什么要求，甚至可以用数字。ID就像是一个人的身份证号码，而Name就像是他的名字，ID显然是唯一的，而Name是可以重复的。

2、表示不同：

标签规定用户可输入数据的输入字段。根据不同的 type 属性，输入字段有多种形态。输入字段可以是文本字段、复选框、密码字段、单选按钮、按钮等等。

id：作为标签的唯一标识。name：作为可与服务器交互数据的HTML元素的服务器端的标示。

定义用法

标签用于搜集用户信息。根据不同的 type 属性值，输入字段拥有很多种形式。输入字段可以是文本字段、复选框、掩码后的文本控件、单选按钮、按钮等等。

标签可定义输入域的开始，在其中用户可输入数据。

对于大量通常的表单控件，可以使用 标签来进行定义，其中包括文本字段、多选列表、可单击的图像和提交按钮等。

虽然 标签中有许多属性，但是对每个元素来说，只有type属性和name属性是必需的（提交或重置按钮只有 type 属性）。

以上内容参考：百度百科-input

id 一般用于css和js中引用,name用于表单提交,只有加了name属性的标签元素才会提交到服务器

ID 是 以 #定义的CSS样式
也可以用JS获取来控制 getElementById(这里是ID) 来获取
name 很多了，就是给当前标签或元素指定名称，也可以用JS来控制值，form提交后获取的时候就需要获取name名称。

name的意义：

1. PHP和html的交互：

   html代码：

   用户名:

   php代码：echo .$_GET['xxx']

   php需要用到name的值"xxx"获取用户在表单中的输入，当用户输入一个用户名如"王二小"，并点击submit按钮后，就会在页面上显示王二小。php通过_GET['xxx']定位相应的input标签，获取用户在该标签中的输入，"王二小"。

2. 单选框(radio)：实现单选效果。多个单选框使用相同的name，才能实现单选，否则可以同时选中这些单选框，单选就无法实现。

3. 复选框(checkbox)：对同类型的复选框进行批量操作。多个同类型的复选框有同一个name，javascript能够对这些同类型的复选框进行统一的操作，比如全选，全不选等操作。

   html代码：

   足球

   篮球

   排球

   javascript代码，定位这3个checkbox，并将其赋值给一个变量chkbx：

   var chkbx = document.getElementsByName("sports");

   对3个checkbox进行遍历，每个checkbox都勾上：

   for(var i=0; i

    getElementById和getElementByName都是为了定位标签，每个标签的id属性是唯一的，可以理解为人的身份证号码。当要同时对多个同类型的标签进行操作时，对这些标签赋予相同的name就可以对多个标签进行批量操作了。

id的意义：

1. 被js利用进行标签定位。id是某个标签唯一的标识，javascript中，可以通过getElementById等方法定位到某个标签，从而对标签进行操作。

2.配合label标签使用，改善用户体验。实现不仅仅是点击单选框或复选框，点击文本也能选定单选框或复选框。

id一般用在前端

name一般用作后端