[转]html js中name和id的区别和使用分析
js中web页面元素的调用可以有两种识别方法:id和name
自己在用的过程中总结一下id和name的使用区别。
一,使用范围
除 BASE, HEAD, HTML, META, SCRIPT, STYLE, TITLE 标签外,id 都可用.
name只用于APPLET,SELECT,FORM,FRAME,IFRAME,IMG,A,INPUT,OBJECT,MAP,PARAM,META.
(name有时有自己的用途)
name 用于 form 内元素,提交需要
id 用于 form 外元素好用因为 DOM 能直接取得单一元素
document.getElementByIdx_xx_x_x(“id_Number”) 得到的是单个元素
document.getElementsByName(“name”) 得到的是数组
注:元素的获取方式
取得 id :document.getElementByIdx_xx_x_x(“idname”)
取得 name : document.getElementsByName(“name”)[0?1?2?3?....]
表单元素 (form input textarea select) 与框架元素 (iframe frame) 用 name
这些元素都与表单 ( 框架元素作用于 form 的 target) 提交有关 , 在表单的接收页面只
接收有 name 的元素 , 赋 ID 的元素通过表单是接收不到值的
Name 其实要复杂的多,因为 Name 有很多种的用途,所以它并不能完全由 ID 来代替,从而将其取消掉。
具体用途有:
用途 1: 作为可与服务器交互数据的 HTML 元素的服务器端的标示,比如 input 、 select 、
textarea 、和 button 等。我们可以在服务器端根据其 Name 通过 Request.Params
取得元素提交的值。
用途 2: HTML 元素 Input type=’radio’ 分组,我们知道 radio button
控件在同一个分组类, check 操作是 mutex 的,同一时间只能选中一个 radio ,这个分组就是根据相同的 Name
属性来实现的。
用途 3: 建立页面中的锚点,我们知道 link 是获得一个页面超级链接,如果不用 href 属性,而改用 Name ,如: ,我们就获得了一个页面锚点。
用途 4: 作为对象的 Identity ,如 Applet 、 Object 、 Embed 等元素。比如在 Applet
对象实例中,我们将使用其 Name 来引用该对象。
用途 5: 在 IMG 元素和 MAP 元素之间关联的时候,如果要定义 IMG 的热点区域,需要使用其属性 usemap
,使 usemap=”#name”( 被关联的 MAP 元素的 Name) 。
用途 6: 某些特定元素的属性,如 attribute ,和 param 。例如为 Object 定义参数。
二,唯一性区别
有些标签,可以同时有name和id.
id 就像身分证号,是唯一的, name 就像姓名一样可以同名
在一个HTML网页中,id是唯一的,即只有某一个标签,或某一个块的标识符是这个id.
而当有多个name时,系统自动使同name归为数组
赋 name: document.formName.inputName document.frames(“frameName”)
赋 ID : document.all.inputID document.all.frameID
在通用的情况下:
NAME.属性
document.NAME.属性
document.getElementsByName(‘NAME’)
ID.属性
document.ID.属性
document.getElementByIdx_xx_x_x(‘ID).属性
http://hi.baidu.com/liu19871112/item/5dfba65df584ac3832e0a922
[转]html js中name和id的区别和使用分析的更多相关文章
- JS中class和id的区别
class和id的区别 class用于css的,id用于js的. 1)class页面上可以重复.id页面上唯一,不能重复. 2)一个标签可以有多个class,用空格隔开.但是id只能有id.
- JS 中的require 和 import 区别整理
ES6标准发布后,module成为标准,标准的使用是以export指令导出接口,以import引入模块,但是在我们一贯的node模块中,我们采用的是CommonJS规范,使用require引入模块,使 ...
- 浅谈JS中的!=、== 、!==、===的用法和区别 JS中Null与Undefined的区别 读取XML文件 获取路径的方式 C#中Cookie,Session,Application的用法与区别? c#反射 抽象工厂
浅谈JS中的!=.== .!==.===的用法和区别 var num = 1; var str = '1'; var test = 1; test == num //tr ...
- JS中isPrototypeOf 和hasOwnProperty 的区别 ------- js使用in和hasOwnProperty获取对象属性的区别
JS中isPrototypeOf 和hasOwnProperty 的区别 1.isPrototypeOf isPrototypeOf是用来判断指定对象object1是否存在于另一个对象object2的 ...
- (网页)Angular.js 中 copy 赋值与 = 赋值 区别
转自st.gg Angular.js 中 copy 赋值与 = 赋值 区别 为什么用 $scope.user = $scope.master; $scope.master 会跟着 $scope.use ...
- js中的substr和substring区别
js中的substr和substring区别 Substring: 该方法可以有一个参数也可以有两个参数. (1) 一个参数: 示例: var str=“Olive”: str.substring( ...
- 区别js中name与id的简单方法
举个简单的例子: <form name="form1"> 用户名:<input type=text name="username" id=&q ...
- js中Attribute和property的区别与联系
相信大多数的初学者对js中的property和attribute的关系很容易搞混, Attribute大多用于DOM的操作中,比如ele.attributes指的是一个元素的特性集合,是一个nodel ...
- JS中property与attribute的区别
property与attirbute都是属性的意思,在JS中很容易混淆,但实际上二者有很大的区别.简单来说, property:是DOM中的属性,是JavaScript中的对像 attribute:是 ...
随机推荐
- MMORPG大型游戏设计与开发(规范)
一件事如果没有规范.章法,那么做这件事起来往往会遇到许多难题,特别是在多人协作的时候,没有到规范通常让每个人多多少少都面临着头疼的困难.举个例子,多个人要做一桌美味的饺子,有买材料.做面皮.弄肉(菜) ...
- jQuery UI常用插件使用
一.什么是插件 ①是遵循一定接口规范编写的程序 ②是原有系统平台功能的扩展和补充 ③只能运行在规定的系统平台下,而不能单独运行 注:由于jQuery插件是基于jQuery脚本库的扩展,所以所有jQue ...
- voxel 与 pixel
中文名称:体素,即顾名思义是体积的像素.用来在三维空间中表示一个显示基本点的单位.类似于二维平面下的pixel(像素). voxel是三维空间中定义一个点的图象信息的单位.在平面中定义一个点要两个坐标 ...
- 关于PHP上传文件和中文名乱码情况
关于PHP文件上传 在前端HTML页面,表单如下 Upload.html <!doctype html><html lang="en"><head&g ...
- 类集-collection接口
类集就是一个动态的对象数组,与一般的对象数组不同,类集的对象类容可以随意扩充. 1,对象数组使用的时候会存在一个长度的限制,那么类集是专门解决这种限制的.使用类集可以向数组增加任意多的数据. 2,对象 ...
- 向数据库中插入一个DateTime类型的数据到一个Date类型的字段中,需要转换类型。TO_DATE('{0}','YYYY-MM-DD'))
需要指出的是,C#中有datetime类型,但是这个类型是包括小时,分钟,秒的.这个格式与数据库中的Date类型不符,如果将now设为datetime类型插入数据会失败. 需要通过TO_DATE('字 ...
- 背包dp整理
01背包 动态规划是一种高效的算法.在数学和计算机科学中,是一种将复杂问题的分成多个简单的小问题思想 ---- 分而治之.因此我们使用动态规划的时候,原问题必须是重叠的子问题.运用动态规划设计的算法比 ...
- Solving GitHub FetchHead (MergeConflict) in Visual Studio 2013
I was getting the error: An error occurred. Detailed message: An error was raised by libgit2. Catego ...
- Linux常用命令笔记
~ 我的home目录/ 系统根目录进入home目录:cd \进入跟目录:cd /Maven编译:mvn clean deploy -U -Dmaven.test.skip=true dependenc ...
- 采用dlopen、dlsym、dlclose加载动态链接库【总结】(转)
1.前言 为了使程序方便扩展,具备通用性,可以采用插件形式.采用异步事件驱动模型,保证主程序逻辑不变,将各个业务已动态链接库的形式加载进来,这就是所谓的插件.linux提供了加载和处理动态链接库的系统 ...