因为在属性中,id时唯一的,getElementById取出的是一个元素
但是可以出现相同的name,取到的是一个Array ,getElementsByName取出的是数组

记录代码如下:

 <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>区分ByName和ById</title>
<style type="text/css">
body {
text-align: center;
margin-left: auto;
margin-right: auto;
}
</style>
</head>
<body>
<b>1.通过document.getElementByName()来取值</b><br/>
年龄:
<input type="text" name="age1" />
<br/>
检测:
<input type="button" onClick="myByName()" value="点我"/>
<script>
function myByName(){
var age1=document.getElementsByName("age1")[0].value;
alert(age1);
if(age1<=18){
alert("小于18岁");
}else{
alert("年龄大于18岁了");
}
} function myById(){
var age=document.getElementById("age").value;
alert(age);
if(age<=18){
alert("小于18岁");
}
else{
alert("年龄大于18岁了");
}
}
</script>
<br/>
<b>2.通过document.getElementById()来取值</b><br/>
年龄:
<input id="age" type="text" />
<br/>
检测:
<input type="button" onclick="myById()" value="点我"/>
<br/>
</body>
</html>

getElementByName()和getElementById的区别的更多相关文章

  1. document.getElementById()与 $()区别

    document.getElementById()返回的是DOM对象,而$()返回的是jQuery对象 什么是jQuery对象? ---就是通过jQuery包装DOM对象后产生的对象.jQuery对象 ...

  2. $()和getElementById()的区别

    jQuery的成功多归功于其强大的选择器. 然而,相信不少初学jQuery的同学都会遇到下面的问题. 在javascript下,我们可以根据getElementById()来获取页面元素.如下: va ...

  3. document.write与document.getElementById的区别

    document.write改变的是整个HTML页面(文档),document.getElementById("demo").innerHTML= 改变的是局部属性

  4. js 原生 document.querySelectorAll document.getElementsByTagName document.querySelector document.getElementById的区别

    1.querySelector只返回匹配的第一个元素,如果没有匹配项,返回null.  2.querySelectorAll返回匹配的元素集合,如果没有匹配项,返回空的nodelist(节点数组). ...

  5. JavaScript中querySelector()和getElementById()(getXXXByXX)的区别

    在日常开发中,使用JavaScript获取元素的时候,最常用的方法就是document.getElementById(getXXXByXX)方法.但是最近发现有很多地方使用的是querySelecto ...

  6. javascript常识

    substring和substr的区别 substring() 方法用于提取字符串中介于两个指定下标之间的字符. stringObject.substring(start,stop)例子: <s ...

  7. DOM_节点层次_Document类型

    一.Document类型 nodeType: 9; nodeName: "#document"; nodeValue: null; parentValue: null; owner ...

  8. Jquery(一) 初识Jquery,简单使用Jquery。

    距离上一篇博文好像隔了很久的时间了额.好像是堕落了一阵子,前些时间去杭州找工作,被租房的事情给搞懵逼了,然后就回来了,回来在修炼一个月在出去奋斗把!加油,这两天把jquery,easyui和boots ...

  9. DOM 对象

    DOM  ==  document object model   document 对象是唯一同时属于  BOM 和 DOM  的   rows 是一种DOM集合,不是数组,所以没有sort() 函数 ...

随机推荐

  1. 实现ApplicationContextAware接口时,获取ApplicationContext为null

    将懒加载关闭,@Lazy(false),默认为true import org.springframework.beans.BeansException; import org.springframew ...

  2. flag--命令行参数解析之StringVar

    func StringVar func StringVar(p *string, name string, value string, usage string) StringVar定义了一个有指定名 ...

  3. CentOS7中升级Docker版本

    参考:http://blog.csdn.net/liumiaocn/article/details/52130852

  4. ActiveMQ安装

    安装环境: 逛网下载最新安装包,ubuntu下解压sudo tar -zxvf xx.tar.启动activeMQ. 报错如下: 原因是没有找到java命令位置,编辑启动配置文件: 再次启动,完成后进 ...

  5. Linux Top 命令解析 比较详细

    [尊重原创文章出自:http://www.jb51.net/LINUXjishu/34604.html] TOP是一个动态显示过程,即可以通过用户按键来不断刷新当前状态.如果在前台执行该命令,它将独占 ...

  6. jquery实现旋转木马的插件slick

    旋转木马的是一般网站上都会有的图片轮播效果, html: <section id="features" class="blue" style=" ...

  7. 时间服务器:NTP 服务器

    15.1 关于时区与网络校时的通讯协议   使得每一部主机的时间同步化.   DHCP 客户端/服务器端所需要的租约时间限制. 网络侦测时所需要注意的时间点.刚刚谈到的登录文件分析功能.具有相关性的主 ...

  8. KBMMW 4.92.00 发布

    We are happy to announce the release of kbmMW Professional and Enterprise Edition. Yet again kbmMW c ...

  9. linux 学习15 16 启动管理,备份和恢复

    第十五讲 启动管理 . CentOS .x 启动管理 //此处指6.3 系统运行级别 .运行级别 运行级别 含 义 关机 单用户模式,可以想象为windows的安全模式,主要用于系统修复 //linu ...

  10. smbclient提示NT_STATUS_INSUFFICIENT_RESOURCES

    Rhel6中使用smbclient命令打开windows共享文件夹,出现: Linux Samba protocol negotiation failed: NT_STATUS_INSUFFICIEN ...