document.getElementBy... 和 document.querySelector

1. 区别

• document.getElementBy... 获取的是动态集合；document.querySelector 获取的是静态集合
• document.getElementBy... 系列接收的参数只能是单一的className、tagName 和 name；而document.querySelectorAll 方法接收的参数是一个 CSS 选择符

2. 用法

1. document.getElementBy...

document.getElementsByTagName('p');

document.getElementById('p1');

document.getElementsByClassName('text');

2. 匹配指定 CSS 选择器元素，可以匹配多个，用，隔开

document.querySelector('.text'）； // 方法返回类名为text的第一个子元素 。

document.querySelectorAll('.text'）； // 方法返回类名为text的所有元素 。