二者的区别与联系
- 区别
-
name
用于多次出现元素的样式定义,`允许有重复的值
-
id
:是唯一标识符,不允许有重复
- 联系
- 功能相同,都可以用来标识
html
标签 - 都可以用
javascript
来根据指定的id / name
获得它的对象引用 - 举例:
document.getElementsByName("XX") // 获得页面所有name元素的对象数组
document.getElementById("XX") //获取id号为”XX”的值
- 举例:
- id 就像是一个人的身份证号码,而 name就像是他的名字,id显然是唯一的,而 name是可以重复的
二者的常见用途
name的常见用途
作为可与服务器交互数据的HTML元素的服务器端的标识,比如
input,select,textarea,button
等,我们可以在服务器端根据其name
通过 Request.Params 取得元素提交的值,当我们需要把这个控件所关联的数据传递到数据库时,就必须要设置 name 属性HTML元素
Input type='radio'
分组,我们知道radio
,button
控件是同一个分组类,操作是互斥的,同一时间只能选中一个radio,这个分组就是根据相同的name
属性来实现的用途3: 建立页面中的锚点,我们知道
<a href="URL">link</a>
是获得一个页面超级链接,如果不用href
属性,而改用name
如:<a name="PageBottom"></a>
,我们就获得了一个页面锚点id的用途
用途1: id就是Client端HTML元素的Identity(标记),主要是在客户端脚本里用。
用途2:
label
与form
控件的关联中,for属性指定与label关联的元素的id,不可用name替代举例:
<label for="MyInput">My Input</label>
<input id="MyInput" type="text">
- 在表单当中,由于有些控件具备多元素特性,例如
radio
,checkbox
等,使用id
不便于表单数据的提交,此外浏览器会根据name
来设定发送到服务器的request,因此在表单当中,用name
来提交数据,如果不指定Name,就不会发送到服务器端 - 除去与表单相关的元素,只能赋
id
而不能赋name
,这些元素有body、li、a、table、tr、td、th、p、div、span、pre、dl、dt、dd、font、b
等等
HTML中name与id的区别对比
|name属性|id属性|
----|----|----
适用的html
元素 | button
、input
、select
、textarea
、a
、img
、form
applet
、frame
、iframe
、map
、meta
、object
、param
| 所有元素
唯一性|不唯一|唯一
作为锚点|可以 [W3C已弃用]|可以
JavaScript关联|getElementsByName() | getElementById()
作为表单提交信息|必须|无
相关文章推荐:
细说HTML元素的ID和Name属性的区别
HTML、CSS里面关于 id、class、name 属性的区别和用法