querySelector-强大的原生DOM选择器
在日常开发过程中，涉及到DOM的操作往往是让前端程序员头疼的。原生的JavaScript提供的操作仅仅是通过tag、id、name等方式来查找，如果想要实现更为复杂的查找，则需要使用正则或类库来实现。下面要说的是querySelector和querySelectorAll。这是操作DOM的新方式，目前所有的浏览器厂商均已经支持。就连IE都在IE8上面做出了支持。下面一起来看一下如何使用吧！
定义
querySelector() 方法返回文档中匹配指定 CSS 选择器的一个元素。
注意：querySelector() 方法仅仅返回匹配指定选择器的第一个元素。如果你需要返回所有的元素，请使用 querySelectorAll() 方法替代。
注释：querySelector 和 querySelectorAll 的使用非常的简单，就像标题说到的一样，它和 CSS 的写法完全一样。没有增加复杂的学习成本。
浏览器支持
语法
document.querySelector(CSS selectors)
参数值介绍
必须。指定一个或多个匹配元素的 CSS 选择器。 可以使用它们的 id、类、 类型、属性、属性值等来选取元素。
对于多个选择器，使用逗号隔开，返回一个匹配的元素。
异常
匹配指定 CSS 选择器的第一个元素。 如果没有找到，返回 null。如果指定了非法选择器则 抛出 SYNTAX_ERR 异常。
实例
1、获取文档中第一个 <span> 元素：
document.querySelector("span");2、获取文档中 class="demo" 的第一个元素：
document.querySelector(".demo");3、获取文档中 class="demo" 的第一个 <span> 元素：
document.querySelector("span.demo");4、获取文档中有 "target" 属性的第一个 <a> 元素：
document.querySelector("a[target]");5、设置文档中第一个h1的背景颜色为红色：
document.querySelector("h1").style.backgroundColor = "red";
