区别js中name与id的简单方法
举个简单的例子:
<form name="form1">
用户名:<input type=text name="username" id="username">
密码:<input type=password name="password" id="pwd">
</form>
如果我要获得用户名和密码;
JS用name获得的话,就得写成document.form1.username.value; document.form1.password.value;
用id获得: docuement.getElementById("username"); docuement.getElementById("pwd");
有时候name 可能会出现相同的名字,所以这时候我们用name获得就无法确定获得的是哪个值了。 document.getElemntsByName("username"); 这里得到的是一个数组。可以说几乎每个做过Web开发的人都问过,到底元素的ID和Name有什么区别阿?为什么有了ID还要有Name呢?! 而同样我们也可以得到最classical的答案:ID就像是一个人的身份证号码,而Name就像是他的名字,ID显然是唯一的,而Name是可以重复的。 name原来是为了标识之用,但是现在根据规范,都建议用id来标识元素。
一、以下只能用name:
1. 表单(form)的控件名,提交的数据都用控件的name而不是id来控制。因为有许多name会同时对应多个控件,比如 checkbox和radio,而id必须是全文档中唯一的。此外浏览器会根据name来设定发送到服务器的request。因此如果用id,服务器是无 法得到数据的。
2. frame和window的名字,用于在其他frame或window指定target。
二、以下只能用id:
1. label与form控件的关联, My Input for属性指定与label关联的元素的id,不可用name替代。
2. CSS的元素选择机制,以#MyId的方式指定应用样式的元素,不能用name替代。
3. 脚本中获得对象: IE支持在脚本中直接以id(而不是name)引用该id标识的对象。例如上面的input,要在脚本中获得输入的内容,可以直接以 MyInput.value来获得。 如果用DOM的话,则用document.getElementByIdx_x("MyInput").value,如果要用name的话,通常先得到包含控件的form,例如 document.forms[0],然后从form再引用name,注意这样得到的是经过计算后将发送给服务器的值。 name与id的其他区别是: id要符合标识的要求,比如大小写敏感,最好不要包含下划线(因为不兼容CSS)。而name基本上没有什么要求,甚至可以用数字 。 用CSS控制这个链接的停留样式, 可以这样写 #m_blog div.opt a:hover{color:#D57813} 或 #myLink:hover{color:#D57813} NAME主要应用在交互式网页,表单提交给某个服务器端脚本后接收变处理量使用。从源代码的规范性和兼容性角度出发,如在客户端 脚本里要索引某个对象,建议用document.getElementByIdx_x()方法,尽量不要直接使用NAME的值
区别js中name与id的简单方法的更多相关文章
- js中,三元运算的简单应用(?:)
js中,三元运算的简单应用: var sinOrMul = ""; sinOrMul =(subType=="single")?("<span ...
- js中的splice方法和slice方法简单总结
slice:是截取用的 splice:是做删除 插入 替换用的 slice(start,end): 参数: start:开始位置的索引 end:结束位置的索引(但不包含该索引位置的元素) 例如: va ...
- js中style.display=""无效的解决方法
本文实例讲述了js中style.display=""无效的解决方法.分享给大家供大家参考.具体解决方法如下: 一.问题描述: 在js中我们有时想动态的控制一个div显示或隐藏或更多 ...
- js中数组去重的几种方法
js中数组去重的几种方法 1.遍历数组,一一比较,比较到相同的就删除后面的 function unique(arr){ ...
- JS 中深拷贝的几种实现方法
JS 中深拷贝的几种实现方法1.使用递归的方式实现深拷贝 //使用递归的方式实现数组.对象的深拷贝 function deepClone1(obj) { //判断拷贝的要进行深拷贝的是数组还是对象,是 ...
- js中判断数据类型的四种方法总结
js中判断数据类型的四种方法 前言 在js中,我们经常需要判断数据的类型,那么哪些方法可以用来判断数据的类型呢?哪种方法判断数据类型最准确呢? 我们来一个个分析: 1.typeof typeof是一个 ...
- [转]html js中name和id的区别和使用分析
js中web页面元素的调用可以有两种识别方法:id和name 自己在用的过程中总结一下id和name的使用区别. 一,使用范围 除 BASE, HEAD, HTML, META, SCRIPT, ST ...
- 浅谈JS中的!=、== 、!==、===的用法和区别 JS中Null与Undefined的区别 读取XML文件 获取路径的方式 C#中Cookie,Session,Application的用法与区别? c#反射 抽象工厂
浅谈JS中的!=.== .!==.===的用法和区别 var num = 1; var str = '1'; var test = 1; test == num //tr ...
- js中的Map对象的简单示例
es6提供一个对象Map, 其功能类似于java中的Map, 下面是java中的Map和js中的Map的简单对比: js中的Map.set()相当于java中的Map.put(), js中的Map.s ...
随机推荐
- 用.net开发音频编辑软件
智能语音机器人软件免不了需要对语音流进行处理,主要包括语音的播放.录制.读取.保存.图形化展示和剪辑等功能.这方面专业的软件有Adobe Audition,为了方便用户使用,我用.net实现了上述功能 ...
- ORM-Dapper快速学习
轻量级ORM框架——第一篇:Dapper快速学习 转载地址:http://www.cnblogs.com/huangxincheng/p/5828470.html 我们都知道ORM全称叫做Objec ...
- sharepoint 2013 office web app 2013 文档在线浏览 IE11 浏览器不兼容解决方法
昨晚配置完成office web apps 2013的外部网络访问之后,今天发现了一个很奇怪的问题,就是IE 11不支持文档在线浏览,找了很多方法,打补丁什么的,都不管用,最后在预览文件的页面,看到& ...
- 《Python黑帽子:黑客与渗透测试编程之道》 网络基础
TCP客户端: 示例中socket对象有两个参数,AF_INET参数表明使用IPv4地址或主机名 SOCK_STREAM参数表示是一个TCP客户端.访问的URL是百度. #coding=utf-8 i ...
- 《Python绝技:运用Python成为顶级黑客》 Python实用小工具
1.实现简单探测 使用socket模块,connect()方法建立与指定IP和端口的网络连接:revc(1024)方法将读取套接字中接下来的1024B数据 mport socket import sy ...
- APP间传递消息
https://www.jianshu.com/p/d640ccfcea5f 1: URL Scheme 常用的App间传值方式.常见于分享等. 2: Keychain 借助系统类 Keychain ...
- Core Data Tutorial for IOS: Getting Started
http://www.raywenderlich.com/934/core-data-tutorial-for-ios-getting-started
- FunDA(8)- Static Source:保证资源使用安全 - Resource Safety
我们在前面用了许多章节来讨论如何把数据从后台数据库中搬到内存,然后进行逐行操作运算.我们选定的解决方案是把后台数据转换成内存中的数据流.无论在打开数据库表或从数据库读取数据等环节都涉及到对数据库表这项 ...
- ACTIVEMQ主题、队列设置用户名密码
修改文件%ACTIVEMQ_BASE%/conf/activemq.xml,用户名密码储存在文件%ACTIVEMQ_BASE%/conf/credentials.properties中, active ...
- day67 crm(4) stark组件的增删改 以及 model_from使用和from组件回顾
前情提要:Django stark 组件开发的 增删改, model_form组件的使用 form组件的回顾 一:list_display_link 创建 功能描述: 使包含的字段能 ...