HTML的id和name

  • id

定义:id 属性规定 HTML 元素的唯一的 id。
用途:
  • 用途1:id是HTML元素的Identity,主要是在客户端脚本里用。
  • 用途2:label与form控件的关联,如
    <label for="MyInput">My Input</label>
    <input id="MyInput" type="text">
    for属性指定与label关联的元素的id,不可用name替代
  • 用途3:脚本中获得对象:IE支持在脚本中直接以id(而不是name)引用该id标识的对象。
    例如上面的input,要在脚本中获得输入的内容,可以直接以 MyInput.value来获得。如果用DOM的话,则用document.getElementById("MyInput").value;
    如果要用name的话,通常先得到包含控件的form,例如document.forms[0],然后从form再引用name,注意这样得到的是经过计算
  • 用途4:在css中作为设置标签的标识。用于定义一个元素的独特的样式
  • name

定义:name 属性规定控件的名称。
用途:
  • 用途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">
  • 两者联系

相同点:

都可以用于标识元素

不同点:
  • 在一个HTML文当中只能有唯一的ID名,而name可以
  • id要符合标识的要求,比如大小写敏感,最好不要包含下划线(因为不兼容CSS),而name没有;
    与表单相关的元素也可以赋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等等
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 136,095评论 19 139
  • HTML 中 id与name 区别 一个name可以同时对应多个控件,比如checkbox和radio。而id必须...
    Yinag阅读 3,952评论 0 1
  • HTML中的id和name id此属性指定一个元素的名称。此名称必须在文档中是唯一的。 name单独地在一个网页里...
    落花的季节阅读 7,408评论 1 3
  • name 指定标签的名称。 格式 特征name属性的值在当前页面下没有唯一性,可以多个一样 用途1)主要是用于获取...
    小m_up阅读 5,663评论 1 0
  • 敬往事一杯酒,再爱也不回头。 让一切都随风都随风都随风。
    樂樂樂樂阅读 1,711评论 0 1

友情链接更多精彩内容