id和name是HTML中经常用到的两个属性,对于这两个属性的使用,会有一些疑惑的地方,比如:
- id有什么用途?
- name有什么用途
- 什么情况下必须用id
- 什么情况下必须用name
- id和name有什么区别?
以下便是基于以上问题的解释。
1. id 的用途
- id就是Client端HTML元素的Identity(标记),主要是在客户端脚本(JavaScript)里用
- label与form控件的关联,如:
<label for="MyInput">My Input</label>
<input id="MyInput" type="text">
<label>
标签的作用是为<input>
元素定义注释
而<label>
标签中的for 属性值必须与相关元素的 id 属性值相同。
- 脚本中获得对象:IE支持在脚本中直接以id(而不是name)引用该id标识的对象。
例如上面的input,要在脚本中获得输入的内容,可以直接以 MyInput.value来获得。如果用DOM的话,则用document.getElementById("MyInput").value;
- 在CSS中用于给HTML中的元素定义一个元素的独特的样式
#idName
{
属性1:属性值1;
属性2:属性值2
}
2. name 的用途
- 作为可与服务器交互数据的HTML元素的服务器端的标示,比如
input
、select
、textarea
、和button
等。我们可以在服务器端根据其Name通过Request.Params取得元素提交的值。 - HTML元素
Input type='radio'
分组,我们知道radio button控件在同一个分组类,check操作是mutex的,同一时间只能选中一个radio,这个分组就是根据相同的Name属性来实现的。 - 建立页面中的锚点,我们知道<a href="URL">link</a>是获得一个页面超级链接,如果不用href属性,而改用Name,如:
<a name="PageBottom"></a>
,我们就获得了一个页面锚点。 - 作为对象的Identity,如Applet、Object、Embed等元素。比如在Applet对象实例中,我们将使用其Name来引用该对象。
- 在IMG元素和MAP元素之间关联的时候,如果要定义IMG的热点区域,需要使用其属性usemap,使
usemap="#name"
(被关联的MAP元素的Name)。 - 某些特定元素的属性,如attribute,meta和param。例如为Object定义参数
<PARAM NAME = "appletParameter" VALUE = "value">
或Meta中<META NAME = "Author" CONTENT = "Dave Raggett">
。
3. 下列情况必须用到id
-
<label>
与 form 控件的关联 - CSS的元素选择机制,以#MyId的方式指定应用样式的元素,不能用
name
替代 - 脚本中获得对象: IE支持在脚本中直接以id(而不是name)引用该id标识的对象
4. 下列情况下必须用到name
- 表单(form)的控件名,提交的数据都用控件的name而不是id来控制。因为有许多name会同时对应多个控件,比如checkbox和radio,而id必须是全文档中唯一的。此外浏览器会根据name来设定发送到服务器的request。因此如果用id,服务器是无法得到数据的。
- frame和window的名字,用于在其他frame或window指定target