JavaScript基础之DOM

1.专门用来获取html标签

let html = document.documentElement

2.专门用来获取head标签

let head = document.head

3.专门用来获取body标签

let body = document.body

以上都是获取一些特殊标签的方法

以下是DOM的常用方法

 

 

1.通过元素ID名称来获取元素

let goTop = document.getElementById('goTop') //传的参数是元素的ID名称

这里要注意一下 ID是元素的唯一标识符 不能有多个 ，如果同名ID有多个页面是不会报错，但是getElementById这个方法只能获取一个ID元素。

2.通过元素的class名来获取元素

let a = document.getElementsByClassName('a')

获取 所有类名为 a 的元素

只要有，不管有多少个，都是在一个伪数组中返回

如果没有，就是返回一个空的伪数组

3.通过元素的标签名来获取元素

let div = document.getElementsByTagName('div')

获取所有的 div 标签

只要有，哪怕只有一个，也是放在伪数组中返回的

如果没有，返回的是一个空的伪数组

4.通过元素的name属性来获取 

let adc = document.getElementsByName('abc')

一般用于获取表单元素 

获取所有name名为 abc 标签

只要有，哪怕只有一个，也是放在伪数组中返回的

如果没有，返回的是一个空的伪数组

5.按照你书写 css 的方式来获取元素 

 let box = document.querySelector('#topBox') //  后面的参数是css选择器

只能获取一个元素

就是满足你选择器的第一个元素

5.按照你书写 css 的方式来获取元素  能获取到所有满足条件的元素

 let box = document.querySelectorAll('#topBox')

能获取，所有满足条件的元素

以伪数组的形式进行返回

只要有，哪怕只有一个，也是放在伪数组中返回的

如果没有，返回的是一个空的伪数组

这个伪数组是可以使用forEach返回 因为它是自带的

NodeList [div#topBox]
length: 1
0: div#topBox
__proto__: NodeList
length: (...)
item: ƒ item()
entries: ƒ entries()
forEach: ƒ forEach()
keys: ƒ keys()
values: ƒ values()
constructor: ƒ NodeList()
Symbol(Symbol.toStringTag): "NodeList"
Symbol(Symbol.iterator): ƒ values()
get length: ƒ length()
__proto__: Object