HTML中id和name

ID简述

id,是identity的缩写,中文"身份标识号码"。id的标准定义:“此属性指定一个元素的名称。此名称必须在文档中是唯一的”,主要是在客户端脚本里用。

  • 用id作为CSS(style sheet)的选择符

    #tablecolor_id{  color: #cccc00;}
    
  • 作为JavaScript引用的元素名称

     <input id="input_name"  type="text" value="name" />  
     document.getElementById("input_name").value;访问元素的
    
NAME简述
  1. 主要是用于获取提交表单的某表单域信息。作为可与服务器交互数据的HTML元素的服务器端的标示。浏览器会根据name来设定发送到服务器的request, 在表单的接收页面只接收有name的元素, 所以赋ID的元素通过表单是接收不到值的。
  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">。

name属性取值在一个表单(form)内应该是唯一的

区别
如何选择name与id

name属性,通常用于为服务器端语言(例如:PHP、JSP)获取用户提交的信息。id属性,通常用于为客户端语言(例如:JavaScript、CSS)进行关联完成相关功能。

常用注意

1、同一个Form里不能有多个name属性相同的HTML标记,但如果一个 网页中有多个Form,则不同的Form里可以有同个Name属性的标记。而ID是全局的,在一个HTML文档里不能有多个节点使用相同的ID,无论它处在哪个Form里。
2、在建立CSS样式的时候,可以建立ID样式表(以#为前缀),使具有该ID的样式直接应用该样式,而无法建立Name样式表。
3、在进行网页编辑时建议使用ID来标识一个节点,而不是使用Name(除非是为了Post提交的需要),同样使用Javascript进行Dom节点定位时建议使用getElementById方法,因为只有ID能唯一标识一个节点,而同一个网页里可能会有多个Name属性相同的节点,它们分别处在不同的Form里。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 总的来说,name是用来提交数据的,提供给表单用,可以重复;id则针对文档操作时候用,不能重复。如:documen...
    jack2gs阅读 2,166评论 0 0
  • 对象区别jersey 1.id所对应对象唯一mysql2.name所对应对象可多个react redux示例:ex...
    16孙一凡通工阅读 2,860评论 0 0
  • HTML 中 id与name 区别 一个name可以同时对应多个控件,比如checkbox和radio。而id必须...
    Yinag阅读 3,945评论 0 1
  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 14,687评论 1 92
  • 拼贴是用不同的材料,颜色,组成一个主题。用不同材料个个的边界组成一个个组块,也就是把他们当成了一个有材质和颜色的面...
    092wiy阅读 1,297评论 0 0

友情链接更多精彩内容