对于许多前端开发项目来说，获取元素进行操作是必不可少的，例如tab标签，全屏切换，自动滚播等效果都需要通过获取节点元素来实现。下面我来总结下JavaScript最常用的4个Document对象中获取元素的方法 getElementById、getElementsByTagName、getElementsByName、getElementsByClassName.
注意的是后三个方法获取的都是对象组，不是单个对象，需要通过下标来调用他们中的元素
getElementById()
作用：用于获取一个基于唯一的ID的元素。
用法：getelementById(),接受一个你要获取的id参数，如果找到相应的元素则返回该元素，如果找不到就返回null。
代码：
HTML中代码：
<div id =”mydiv”>Hello</div>
JavaScript中代码：
var mydiv = document.getElementById(“mydiv”); //获取<div>元素
getElementsByTagName
作用：用于获取对应标签的所有对象
用法：getElementsByTag(),接受一个你要获取的标签的参数，返回含零或多个元素的NodeList（节点列表，与数组类似）
代码：
HTML中代码：
<p>hello</p>
<p>hi</p>
<p>i am fine</p>
JavaScript中代码：
var array = document.getElementsByTagName(“p”); //获取p的元素节点列表
P[0].style.color =”red” //”hello”变为红色字体
getElementsByName
作用：用于获取对应name名的所有元素
用法：getElementsByName(),接受一个你要获得name名的参数，返回含零或多个元素的NodeList（节点列表，与数组类似）
代码：
HTML中代码：
<p name=”lid”>hello</p>
<p name=”lid”>hi</p>
JavaScript中代码：
var name = document.getElementsByName(“lid”); //获取name为lid所有元素节点
Name[0]; //”hello”
getElementsByClassName
作用：用于获取对应class名的所有元素
用法：getElementsByClassName(),接受一个你要获得class名的参数，返回含零或多个元素的NodeList（节点列表，与数组类似）
HTML中代码：
<p class=”lid”>hello</p>
<p class=”lid”>hi</p>
JavaScript中代码：
var name = document.getElementsByClassName(“lid”); //获取name为lid所有元素节点
Name[0]; //”hello”