querySelector()标签元素选择器
document.querySelector 选择器
选中 类名等于 note的元素
选中 data-foo-bar 属性等于 someval 的元素
选中 myForm 表单中所有不通过验证的元素
展示部分querySelector匹配器示例，恩`querySelector匹配器本质上使用的就是CSS样式选择器
document.querySelector("[class=abc]").innerHTML
document.querySelectorAll('[data-foo-bar="someval"]');
document.querySelectorAll('[data-foo-bar="someval"]');
document.querySelectorAll('#myForm :invalid');
选中div元素，那些 class 含 ignore 的除外
document.querySelectorAll('DIV:not(.ignore)');
同时选中 div，a，script 三类元素
document.querySelectorAll('DIV, A, SCRIPT');
document.querySelector('#' + CSS.escape('foo#bar'))
var preview = document.querySelector('img');
var file = document.querySelector('input[type=file]').files[0];
但是，它们不支持 CSS 伪元素的选择器（比如:first-line和:first-letter）和伪类的选择器（比如:link和:visited），即无法选中伪元素和伪类。
如果querySelectorAll方法的参数是字符串*，则会返回文档中的所有元素节点。
整体上document.querySelector()方法的参数使用 CSS 选择器语法
mozilla文档
https://developer.mozilla.org/zh-CN/docs/Web/API/Document/querySelectorAll
