[转]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

时间: 2024-10-16 14:18:11

[转]html js中name和id的区别和使用分析的相关文章

浅谈JS中的!=、== 、!==、===的用法和区别 JS中Null与Undefined的区别 读取XML文件 获取路径的方式 C#中Cookie,Session,Application的用法与区别? c#反射 抽象工厂

var num = 1;    var str = '1';    var test = 1;    test == num  //true 相同类型 相同值    test === num //true 相同类型 相同值    test !== num //false test与num类型相同,其值也相同, 非运算肯定是false    num == str  //true 把str转换为数字,检查其是否相等.    num != str  //false == 的 非运算    num ==

JS中isPrototypeOf 和hasOwnProperty 的区别 ------- js使用in和hasOwnProperty获取对象属性的区别

JS中isPrototypeOf 和hasOwnProperty 的区别 1.isPrototypeOf isPrototypeOf是用来判断指定对象object1是否存在于另一个对象object2的原型链中,是则返回true,否则返回false. 格式如下: object1.isPrototypeOf(object2); object1是一个对象的实例: object2是另一个将要检查其原型链的对象. 原型链可以用来在同一个对象类型的不同实例之间共享功能. 如果 object2 的原型链中包含

Angular.js 中 copy 赋值与 = 赋值 区别

转自st.gg Angular.js 中 copy 赋值与 = 赋值 区别 为什么用 $scope.user = $scope.master; $scope.master 会跟着 $scope.user 改变?angular.copy 和 = 号赋值有什么区别呢?新手还没有搞懂,请教各位了. <!DOCTYPE html> <html> <script src= "http://apps.bdimg.com/libs/angular.js/1.3.9/angular

js中import和require的区别

js中import和require的区别ES6标准发布后,module成为标准,标准使用是以export指令导出接口,以import引入模块.但是在我们一贯的node模块中,我们依然采用的是CommonJS规范,使用require引入模块,使用module.exports导出接口. require它相当于module.exports的传送门,module.exports后面的内容是什么,require的结果就是什么,对象.数字.字符串.函数……再把require的结果赋值给某个变量,相当于把re

JS中深拷贝与浅拷贝的区别,实现深拷贝的几种方法

JS中深拷贝与浅拷贝的区别,实现深拷贝的几种方法 如何区分深拷贝与浅拷贝,简单点来说,就是假设B复制了A,当修改A时,看B是否会发生变化,如果B也跟着变了,说明这是浅拷贝,拿人手短,如果B没变,那就是深拷贝,自食其力. 此篇文章中也会简单阐述到栈堆,基本数据类型与引用数据类型,因为这些概念能更好的让你理解深拷贝与浅拷贝. 我们来举个浅拷贝例子: let a=[0,1,2,3,4], b=a; console.log(a===b); a[0]=1; console.log(a,b); 嗯?明明b复

oracle中union和union all区别与性能分析

[ 概要 ] 经常写sql的同学可能会用到union和union all这两个关键词, 可能你知道使用它们可以将两个查询的结果集进行合并, 那么二者有什么区别呢? 下面我们就简单的分析下. [ 比较 ] union: 对两个结果集进行并集操作, 不包括重复行,相当于distinct, 同时进行默认规则的排序; union all: 对两个结果集进行并集操作, 包括重复行, 即所有的结果全部显示, 不管是不是重复; 下面我们举一个简单的例子来证明上面的结论: 1. 准备数据: drop table

input中name和id的区别

一直很困惑,表单里面input标签有id和name,它们之间到底有什么区别自己很少去想,只知道一般的场景该怎么使用,今天就在网上搜索了一下,自己也总结一下.为什么有了ID还要有Name呢?其实ID就像是一个人的身份证号码,而Name就像是他的名字,ID显然是唯一的,而Name是可以重复的. name与id的还有区别是: id要符合标识的要求,比如大小写敏感,最好不要包含下划线(因为不兼容CSS).而name基本上没有什么要求,甚至可以用数字. 补充:name主要是表单元素里才有的属性.通过js的

js中opener和parent的区别

opener即谁打开我的,比如A页面利用window.open弹出了B页面窗口,那么A页面所在窗口就是B页面的 opener,在B页面通过opener对象可以访问A页面. parent表示父窗口,比如一个A页面利用iframe或frame调用B页面,那么A页面所在窗口就是B页面的parent.在JS 中,window.opener只是对弹出窗口的母窗口的一个引用.比如:a.html中,通过点击按钮等方式window.open出一个新的窗口 b.html.那么在b.html中,就可以通过windo

js中 opener和parent的区别

opener即谁打开我的,比如A页面利用window.open弹出了B页面窗口,那么A页面所在窗口就是B页面的opener,在B页面通过opener对象可以访问A页面.parent表示父窗口,比如一个A页面利用iframe或frame调用B页面,那么A页面所在窗口就是B页面的parent.在JS中,window.opener只是对弹出窗口的母窗口的一个引用.比如:a.html中,通过点击按钮等方式window.open出一个新的窗口b.html.那么在b.html中,就可以通过window.op