HTML中id与name的用法
可以说几乎每个做过Web开发的人都问过,到底元素的ID和Name有什么区别阿?为什么有了ID还要有Name呢?
而同样我们也可以得到最经典的答案:ID就像是一个人的身份证号码,而Name就像是他的名字,ID显然是唯一的,而Name是可以重复的。
上面一段对于ID和Name的解答说的太笼统了,以下我们来具体探讨一下。
一、name和id 都可以用来调用html中的元素
当我们需要在脚本里访问页面内一个html元素的时候,一般都是通过指定HTML元素的id或name
WEB标准下可以通过getElementById() 、getElementsByName() 、 getElementsByTagName()访问HTML文档中的任一个元素。
要访问某一特定元素尽量用标准的document.getElementById(id)。
如果一个文档中有两个以上的标签NAME相同,那么document.getElementsByName(name)就可以取得这些元素组成一个数组。
访问标签则用标准的document.getElementByTagName(tag)。
注意:id 标识的是大小写敏感的,而name基本上没有什么要求,甚至可以用数字。
二、什么情况下必须用name?
1、表单元素(例如:form、input、textarea、select 、button 等)通常与表单提交有关,在表单的接收页面只接收有name的元素,赋id的元素通过表单是接收不到值的。在form里面,如果不指定Name的话,就不会发送到服务器端。
2、表单元素复选框checkbox、单选按钮
radio 通常会对应多个控件,这时必须用name属性来实现分组。同一组使用同一个name。使两个题目的选项之间不产生干扰。
3、框架元素(iframe、frame)的名字,用于在其他iframe、frame指定target。
4、建立页面中的锚点,我们知道<a href="URL">link</a>是获得一个页面超级链接,如果不用href属性,而改用name,如:<a name="pageTop"></a>,我们就获得了一个页面锚点。
5、在IMG元素和MAP元素之间关联的时候,如果要定义IMG的热点区域,需要使用其属性usemap,使usemap="#name"(被关联的MAP元素的name)。
6、某些特定元素的属性,如attribute,meta和param。例如为Object定义参数<PARAM NAME = "appletParameter" VALUE = "value">或Meta中<META NAME = "Author" CONTENT = "Admin10000.com">
三、什么情况下必须用id ?
1、label与form控件的关联。
<label for="MyInput">My
Input</label>
<input id="MyInput"
type="text">
for属性指定与label关联的元素的id,不可用name替代
2、id 可以用来设置一个css样式。
3、脚本中获得对象:IE支持在脚本中直接以id(而不是name)引用该id标识的对象。
例如上面的input,要在脚本中获得输入的内容,可以直接以 MyInput.value来获得。如果用DOM的话,则用document.getElementById("MyInput").value;
如果要用name的话,通常先得到包含控件的form,例如document.forms[0],然后从form再引用name,注意这样得到的是经过计算后将发送给服务器的值
name与id 区别
id要符合标识的要求,比如大小写敏感,最好不要包含下划线(因为不兼容CSS)。而name基本上没有什么要求,甚至可以用数字。
table、tr、td、div、p、span、h1、li等元素一般用id。与表单相关的元素也可以赋ID值, 但为这些元素赋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等等
HTML中id与name的用法的更多相关文章
- Spring mvc中@RequestMapping 6个基本用法
Spring mvc中@RequestMapping 6个基本用法 spring mvc中的@RequestMapping的用法. 1)最基本的,方法级别上应用,例如: Java代码 @Reques ...
- SQL Server中Rowcount与@@Rowcount的用法 和set nocount on 也会更新@@Rowcount
rowcount的用法: rowcount的作用就是用来限定后面的sql在返回指定的行数之后便停止处理,比如下面的示例, set rowcount 10select * from 表A 这样的查询只会 ...
- Linq中关键字的作用及用法
Linq中关键字的作用及用法 1.All:确定序列中的所有元素是否都满足条件.如果源序列中的每个元素都通过指定谓词中的测试,或者序列为空,则为 true:否则为 false. Demo: 此示例使用 ...
- SQL Server中Rowcount与@@Rowcount的用法
rowcount的用法: rowcount的作用就是用来限定后面的sql在返回指定的行数之后便停止处理,比如下面的示例, set rowcount 10select * from 表A 这样的查询只会 ...
- HTML中id、name、class 区别
参考:http://www.cnblogs.com/polk6/archive////.html http://blog.csdn.net/ithomer/article/details/ HTML ...
- jquery中append跟prepend的用法
jquery中append和prepend的用法 append 是插入到元素中,并放到元素内的最后面prepend 是插入到元素中,并放到元素内的最前面例$("body"). ...
- SQL Server 中 with tmp 临时表的用法
SQL Server 中 with tmp 临时表的用法 ----------with临时表用法,有时候采用临时表比采用in的效率更高,避免了全表扫描. 实例中实现了查询普通题.大题.子题目的sql ...
- html css中id和class的区别比较
在定义样式的时候,有时候会将id和class的用法弄混淆,所以在这里特意说明一下: id和class属性是网页中两个通用的属性,它们协同工作使整个页面变得丰富多彩.当我们为一个元素定义样式时.可以使用 ...
- 转载——SQL Server中Rowcount与@@Rowcount的用法
转载自:http://www.lmwlove.com/ac/ID943 rowcount的用法: rowcount的作用就是用来限定后面的sql在返回指定的行数之后便停止处理,比如下面的示例, set ...
随机推荐
- cache工作原理
转:http://www.360doc.com/content/11/0307/21/3791508_99049437.shtml
- Python3.x:第三方库简介
Python3.x:第三方库简介 环境管理 管理 Python 版本和环境的工具 p – 非常简单的交互式 python 版本管理工具. pyenv – 简单的 Python 版本管理工具. Vex ...
- EFM32JG系列MCU内部温度传感器使用方法
在很多电子类应用场合中,我们经常需要采集产品工作的周围环境温度,一般采取的方式有两种: 1)外加温度传感器 2)采用MCU内部温度传感器 外加温度传感器会增加产品的成本以及布板空间,所以在很多场合,我 ...
- 关于div可编辑的复制粘贴问题
todoFilter(e) { e.preventDefault(); if (!e.target.getAttribute('contenteditable')) { return; } const ...
- React Native实战系列教程之自定义原生UI组件和VideoView视频播放器开发
React Native实战系列教程之自定义原生UI组件和VideoView视频播放器开发 2016/09/23 | React Native技术文章 | Sky丶清| 4 条评论 | 1 ...
- Sudoku Solver, 求数独
问题描述:填充数独表中空元素.空元素为'.' 算法分析:没填充一个数,都要看这个数所在的行,列,小矩阵是否合法.然后还要看整个数独表是否正确,而判断整个数独表只能通过递归,因为前一个结果的判断要依赖后 ...
- RabbitMQ 之 WorkQueues工作队列
模型图 为什么会出现 work queues? 前提:使用 simple 队列的时候 (上一篇博客)我们应用程序在是使用消息系统的时候,一般生产者 P 生产消息是毫不费力的(发送消息即可),而消费者接 ...
- org.apache.log4j.Logger用法
在应用程序中添加日志记录总的来说基于三个目的 :监视代码中变量的变化情况,周期性的记录到文件中供其他应用进行统计分析工作:跟踪代码运行时轨迹,作为日后审计的依据:担当集成开发环境中的调试器的作用,向文 ...
- tech| kafka入门书籍导读
J梳理了一下自己在入门 kafka 时读过的一些书, 希望能帮助到对 kafka 感兴趣的小伙伴. 涉及到的书籍: kafka 权威指南 Kafka: The Definitive Guide (ka ...
- LeetCode第[11]题(Java):Container With Most Water (数组容器盛水)——Medium
题目难度:Medium Given n non-negative integers a1, a2, ..., an, where each represents a point at coordina ...