获取DOM元素方式

获取DOM元素方式

1、根据id获取元素

代码如下（示例）：

var div1 = document.getElementById("box1");

2、通过类名获取元素

代码如下（示例）：

var p1Arr = document.getElementsByClassName("p1");
console.log(p1Arr instanceof Array);//false
console.log(Array.isArray(p1Arr));//false
console.log(p1Arr.length);
console.log(p1Arr[0]);
console.log(p1Arr[1]);

3、通过标签名获取元素

代码如下（示例）：

var tag1 = document.getElementsByTagName("div");
console.log(tag1);
console.log(tag1[0]);

4、通过name名获取元素

代码如下（示例）：

var userList = document.getElementsByName("user");
  console.log(userList);
  for (var i = 0; i < userList.length; i++) {
    console.log(userList[i]);
  }

5、通过选择器的querySelector获取元素

querySlector():获取指定选择器的第一个元素，参数就是选择器的名称

代码如下（示例）：

var div1 = document.querySelector(".box1");
  console.log(div1);
  var li1 = document.querySelector("ul>li");
  console.log(li1);
  var user_1 = document.querySelector("#user_1");
  console.log(user_1)

6、通过选择器的querySelectorAll获取元素

querySelectorAll():获取指定选择器的所有的元素，参数就是选择器的名称
代码如下（示例）：

var boxList = document.querySelectorAll(".box1");
  console.log(boxList);
  var listLi = document.querySelectorAll("ul li");
  console.log(listLi);