【HTML】id与name的用法

可以说几乎每个做过Web开发的人都问过，到底元素的ID和Name有什么区别阿？为什么有了ID还要有Name呢？

而同样我们也可以得到最经典的答案：ID就像是一个人的身份证号码，而Name就像是他的名字，ID显然是唯一的，而Name是可以重复的。

上面一段对于ID和Name的解答说的太笼统了，以下我们来具体探讨一下。

一、name和id 都可以用来调用html中的元素

当我们需要在脚本里访问页面内一个html元素的时候，一般都是通过指定HTML元素的id或name

WEB标准下可以通过getElementById() 、getElementsByName() 、 getElementsByTagName()访问HTML文档中的任一个元素。

要访问某一特定元素尽量用标准的document.getElementById(id)。

如果一个文档中有两个以上的标签NAME相同，那么document.getElementsByName(name)就可以取得这些元素组成一个数组。

访问标签则用标准的document.getElementByTagName(tag)。

注意：id 标识的是大小写敏感的，而name基本上没有什么要求，甚至可以用数字。

二、什么情况下必须用name?

1、表单元素（例如：form、input、textarea、select 、button 等)通常与表单提交有关，在表单的接收页面只接收有name的元素，赋id的元素通过表单是接收不到值的。在form里面,如果不指定Name的话,就不会发送到服务器端。

2、表单元素复选框checkbox、单选按钮 radio 通常会对应多个控件，这时必须用name属性来实现分组。同一组使用同一个name。使两个题目的选项之间不产生干扰。

3、框架元素（iframe、frame）的名字，用于在其他iframe、frame指定target。

4、建立页面中的锚点，我们知道<a href="URL">link</a>是获得一个页面超级链接，如果不用href属性，而改用name，如：<a name="pageTop"></a>，我们就获得了一个页面锚点。

5、在IMG元素和MAP元素之间关联的时候，如果要定义IMG的热点区域，需要使用其属性usemap，使usemap="#name"(被关联的MAP元素的name)。

6、某些特定元素的属性，如attribute，meta和param。例如为Object定义参数<PARAM NAME = "appletParameter" VALUE = "value">或Meta中<META NAME = "Author" CONTENT = "Admin10000.com">

三、什么情况下必须用id ?

1、label与form控件的关联。

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

2、id 可以用来设置一个css样式。

3、脚本中获得对象：IE支持在脚本中直接以id（而不是name）引用该id标识的对象。

例如上面的input，要在脚本中获得输入的内容，可以直接以 MyInput.value来获得。如果用DOM的话，则用document.getElementById("MyInput").value；

如果要用name的话，通常先得到包含控件的form，例如document.forms[0]，然后从form再引用name，注意这样得到的是经过计算后将发送给服务器的值

name与id 区别 

id要符合标识的要求，比如大小写敏感，最好不要包含下划线（因为不兼容CSS）。而name基本上没有什么要求，甚至可以用数字。

table、tr、td、div、p、span、h1、li等元素一般用id。与表单相关的元素也可以赋ID值,  但为这些元素赋ID值的时候引用这些元素的方法就要变一下了，具体的如下： 

赋name时，引用元素的方式:  document.formName.inputName 或 document.frames("frameName") 
赋id时，引用元素的方式:  document.all.inputID 或 document.all.frameID 
除去与表单相关的元素，只能赋id不能赋name，这些元素有body、li、a、table、tr、td、th、p、div、span、pre、dl、dt、dd、font、b等等