• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com专业计算机教程网站
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure
您的位置:首页 > 网页设计 >html/xhtml > input中id和name属性的区别示例介绍

input中id和name属性的区别示例介绍

作者:佚名 字体:[增加 减小] 来源:互联网 时间:2017-08-05

本文主要包含input,id,name等相关知识,佚名 希望在学习及工作中可以帮助到您
做网站很久了,但到现在还没有搞明白input中name和id的区别,最近学习jquery,又遇到这个问题,就在网上搜集资料。看到这篇,就整理出来,以备后用。

可以说几乎每个做过Web开发的人都问过,到底元素的ID和Name有什么区别阿?为什么有了ID还要有Name呢?! 而同样我们也可以得到最classical的答案:ID就像是一个人的身份证号码,而Name就像是他的名字,ID显然是唯一的,而Name是可以重复的。

上周我也遇到了ID和Name的问题,在页面里输入了一个input type="hidden",只写了一个ID='SliceInfo',赋值后submit,在后台用Request.Params["SliceInfo"]却怎么也去不到值。后来恍然大悟因该用Name来标示,于是在input里加了个Name='SliceInfo',就一切ok了。

第一段里对于ID和Name的解答说的太笼统了,当然那个解释对于ID来说是完全对的,它就是Client端HTML元素的Identity。而Name其实要复杂的多,因为Name有很多种的用途,所以它并不能完全由ID来代替,从而将其取消掉。具体用途有:

用途1: 作为可与服务器交互数据的HTML元素的服务器端的标示,比如input、select、textarea、和button等。我们可以在服务器端根据其Name通过Request.Params取得元素提交的值。
用途2: HTML元素Input type='radio'分组,我们知道radio button控件在同一个分组类,check操作是mutex的,同一时间只能选中一个radio,这个分组就是根据相同的Name属性来实现的。
用途3: 建立页面中的锚点,我们知道<a href="URL">link</a>是获得一个页面超级链接,如果不用href属性,而改用Name,如:<a name="PageBottom"></a>,我们就获得了一个页面锚点。
用途4: 作为对象的Identity,如Applet、Object、Embed等元素。比如在Applet对象实例中,我们将使用其Name来引用该对象。
用途5: 在IMG元素和MAP元素之间关联的时候,如果要定义IMG的热点区域,需要使用其属性usemap,使usemap="#name"(被关联的MAP元素的Name)。
用途6: 某些特定元素的属性,如attribute,meta和param。例如为Object定义参数<PARAM NAME = "appletParameter" VALUE = "value">或Meta中<META NAME = "Author" CONTENT = "Dave Raggett">。

显然这些用途都不是能简单的使用ID来代替掉的,所以HTML元素的ID和Name的却别并不是身份证号码和姓名这样的区别,它们更本就是不同作用的东西。

当然HTML元素的Name属性在页面中也可以起那么一点ID的作用,因为在DHTML对象树中,我们可以使用document.getElementsByName来获取一个包含页面中所有指定Name元素的对象数组。Name属性还有一个问题,当我们动态创建可包含Name属性的元素时,不能简单的使用赋值element.name = "..."来添加其Name,而必须在创建Element时,使用document.createElement('<element name = "myName"></element>')为元素添加Name属性。这是什么意思啊?看下面的例子就明白了。

body li table tr td th p div span pre dl dt dd font b 等等

您可能想查找下面的文章:

  • input checkbox 扩大点击范围的实现方法
  • 关于input的file 控件及美化
  • 浅谈html中input只读属性readonly和disable的区别
  • 点击按钮文字变成input框,点击保存变成文字的实现代码
  • 修改输入框placeholder文字默认颜色-webkit-input-placeholder方法
  • 浅析html input 等值改变添加监听事件
  • 详解HTML的<input> 标签及其禁用方法
  • 详解HTML的<input> 标签及其禁用方法
  • html禁止清除input文本输入缓存的两种方法
  • 关于type="file"的input框样式修改小结

相关文章

  • 2017-08-05html+css+jquery模仿搜索风云榜选项卡效果有截图
  • 2017-08-05用DIV遮罩解决鼠标直接勾选checkbox无效的问题
  • 2017-08-05表单文件选择框样式自定义示例
  • 2017-08-05IE6的BUG及修复 谓防患于未然的策略
  • 2017-08-05一些编写高性能HTML应用的建议
  • 2017-11-26img标签 onerror事件
  • 2017-08-05按回车表单自动提交问题意外发现
  • 2017-08-05HTML head 头标签详细介绍
  • 2017-08-05W3C教程(12):W3C Soap 活动
  • 2017-08-05Html+css实现纯文字和带图标的按钮

文章分类

  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure

最近更新的内容

    • HTML中div与span的区别(共同点与不同点)
    • 禁止页面缓存的几种方法分享
    • html页面跳转及参数传递
    • td单元格合并时 td宽度问题
    • 使用相对宽度调整表格问题
    • html doctype 作用介绍
    • HTML输入框优化以此来提高用户体验和易用度
    • UTF-8和GB2312网页编码
    • Nofollow标签的写法以及nofollow使用介绍
    • HTML教程:图片大小对齐间隔边框属性修改方法介绍

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有