WEB标准下可以通过getElementById(), getElementsByName(), and getElementsByTagName()访问DOCUMENT中的任一个标签: 
getElementById()
getElementById()可以访问DOCUMENT中的某一特定元素,顾名思义,就是通过ID来取得元素,所以只能访问设置了ID的元素。(唯一一个)
比如说有一个DIV的ID为do:
<div id="do"></div>
那么就可以用getElementById("do")来获得这个元素。

因为DOCUMENT中每一个元素的ID是唯一的,但NAME却可以重复。打个比喻就像人的身份证号是唯一的(理论上,虽然现实中有重复),但名字重复的却很多。

getElementsByName()
这个是通过NAME来获得元素,但不知大家注意没有,这个是GET ELEMENTS,复数ELEMENTS代表获得的不是一个元素,为什么呢?

如果一个文档中有两个以上的标签NAME相同,那么getElementsByName()就可以取得这些元素组成一个数组。

比如有两个DIV:
<div name="doname" id="do1"></div>
<div name="doname" id="do2"></div>
那么可以用getElementsByName("doname")获得这两个DIV,用getElementsByName("doname")[0]访问第一个DIV,用getElementsByName

getElementsByTagName()
这个呢就是通过TAGNAME(标签名称)来获得元素,一个DOCUMENT中当然会有相同的标签,所以这个方法也是取得一个数组。
假如有两个DIV,可以用getElementsByTagName("div")来访问它们,用 getElementsByTagName("div")[0]访问第一个DIV,用getElementsByTagName("div")[1]访问第二个DIV。

还有一点就是

var oDoc=document.getElementById("doc");    //只能用 document获取

var  adiv=document.getElementsByTagName("div");  //既可以用document获取

var  adiv=oDoc.getElementsByTagName("div");       //还可以通过父级的id获取

初学站到,有问题欢迎指出。

getElementsByTagName 、 getElementsByName 、getElementById区别的更多相关文章

  1. js 取值 getElementsByTagName,getElementsByName

    getElementsByTagName,getElementsByName  获取的值是数组的所以用[0][1]引用 1 <select multiple size="2" ...

  2. autohotkey 自动登录输入用户名密码 getElementsByTagName/getElementsByClassName/getElementById

    针对button未设置id的.可以通过getElementsByTagName获取button的对象数组,再明确其在对象数组中的位置,如第4个button,通过[3]获取.再调用此对象的click() ...

  3. Web前端-JavaScript基础教程上

    Web前端-JavaScript基础教程 将放入菜单栏中,便于阅读! JavaScript是web前端开发的编程语言,大多数网站都使用到了JavaScript,所以我们要进行学习,JavaScript ...

  4. web前端:js

    内嵌样式<script></script> alert(“123”)弹出对话框 document.write(“test”) 引入方式 <title></ti ...

  5. querySelector和getElementById方法的区别

    一.querySelector() 的定义 querySelector() 方法选择指定 CSS 选择器的第一个元素 querySelectorAll() 方法选择指定的所有元素 二.与 getEle ...

  6. getElementsByTagName

    1.getElementsByTagName * document.getelementByID(id名称)* 通过id名称获取元素,它只有一个主语,docment(整个文档)** getElemne ...

  7. 前端必备的js知识点(转载)

    1.本文主体源自:http://www.cnblogs.com/coco1s/p/4029708.html,有兴趣的可以直接去那里看,也可以看看我整理加拓展的.2.js是一门什么样的语言及特点?    ...

  8. 《Javascript高级程序设计第3版》精华总结

    一.JavaScript简介   1.1 javascript简史 1.2 javascript实现 + javascript是一种专为网页交互而设计的一种脚本语言,javascript由三大部分组成 ...

  9. document.all的详细解释(document.all基本上所有浏览器可用!)

    从何而来从IE4开始IE的object model才增加了document.all对象,MSDN中也对 Object.all 有详细的说明,Object.all是个HTMLCollection,不是数 ...

随机推荐

  1. redis 有用

     浅谈redis   (1)什么是redis? Redis 是一个基于内存的高性能key-value数据库. (有空再补充,有理解错误或不足欢迎指正)   (2)Reids的特点 redis本质上是一 ...

  2. ROS Learning-002 beginner_Tutorials 如何添加ROS环境变量 和 如何更新ROS源代码

    ROS Indigo beginner_Tutorials 之 添加环境变量 和 更新ROS源代码的命令 我使用的虚拟机软件:VMware Workstation 11 使用的Ubuntu系统:Ubu ...

  3. noi.ac day1t1 candy

    传送门 分析 我们知道如果设A,B分别为将两家店从大到小排序之后各自的前缀和,则 Ans=Max{Min{A[i],B[j]}-W*(i+j)}. 为了得到这个Ans我们可以枚举两个数的Min,然后剩 ...

  4. 37LCD-TFTLCD原理与配置

    1.TFTLCD驱动原理 简介

  5. C#根据弹窗标题获取窗体句柄并模拟点击按钮(FindWindow,FindWindowEx,SendMessage)

    任务:将下面弹窗自动关闭 /// <summary> /// 找到窗口 /// </summary> /// <param name="lpClassName& ...

  6. chrome浏览器跨域模式设置

    做前后分离的webapp开发的时候,出于一些原因往往需要将浏览器设置成支持跨域的模式,好在chrome浏览器就是支持可跨域的设置,网上也有很多chrome跨域设置教程.但是新版本的chrome浏览器提 ...

  7. 循环对XML文档添加Attribute以及移除Element

    如下面的图片要求,需要把左边的xml文改为右边的文档. 需要添加Attribute,移除Element,但是所添加的Attribute值已经跟被移除的Element值不相同.实现方法可以参考<对 ...

  8. kolla-build镜像时,问题汇总

    记录下kolla-build镜像时,遇到的一些问题,既为了方便自己以后问题的查找,也为了帮助别人避免踩这些坑.遇到的问题会持续更新在博客里面. 问题1:使用的kolla 版本是ocata版本,本地已经 ...

  9. Django之高级视图与URL

    Urls.py中有我们所有的路由映射关系.但是随着网站功能的增多,需要配置的URL也变得多了起来.并且维护这些导入也变得很麻烦.因此介绍一些优化和简洁的方法: 一 使用多个视图前缀: 之前所有的路由关 ...

  10. Hawk-and-Chicken 强连通

    题意:一群人投票  票具有传递性  求出累计和最大的数和 哪几个人最大 强连通好题!!! 毫无疑问先强连通缩点 一开始打算拓扑排序求dis  但是发现拓扑排序会有重复累加的情况 那么就反向建图   当 ...