DOM上知识总结

 6.3 获取元素

1.根据id属性获取元素

document . getElementById("id属性值") 

let btn = document.getElementById("btn")
        console.log(btn);

2.根据标签名获取元素

document . getElementByTagName("标签名") 

let liList = document.getElementsByTagName("li")
        console.log(liList);

3.根据name/id属性获取元素

document . getElementsByName("name属性值")

let fruits = document . getElementsByName("fruit")
       console.log(fruit)

4.通过id选择器获取元素对象

document . querySelector(“#id名") 

let area = document.querySelector("#area")
        console.log(area);

5.通过class类选择器获取元素对象

document . querySelector(".类名") 

let count = document.querySelector(".count")
        console.log(count);

6.根据CSS选择器获取元素

document . querySelector("CSS选择器") //获取类名为play的第一个div

document . querySelectorAll("CSS选择器") //获取类名为play的所有div

let firstPro = document.querySector(".play")
       console.log(firstPro)

let firstPro = document.querySectorAll(".play")
       console.log(firstPro)

7.获取基本结构元素

document.documentElement    //获取文档的 html元素

let htmlEle = document.documentElement;
console.log(htmlEle)

document.body    //获取文档的 body 元素

let bodyEle = document.body;
console.log(bodyEle)

document.forms    //获取文档中包含所有 form元素的集合

document.images    //获取文文档中包含所有image元素的集合