jQuery的核心就是通过CSS选择符查询DOM文档取得元素的引用，从而抛开了getElementById()和getElementsByTagName()。
Selectors API致力于让浏览器原生支持CSS查询。
11.1.1 querySelector()方法
接收一个css选择器，返回与该模式匹配的第一个元素。如果没有找到匹配的元素，返回null。
通过document对象调用该方法，会在文档元素范围内查找匹配的元素。而通过Element类型调用querySelector()方法时，则是在其后代元素范围内查找匹配的元素。
11.1.2 querySelectorAll()方法
querySelectorAll()方法接收的参数与querySelector一样，只是返回所有匹配的元素。返回值是一个NodeList的实例。返回的值实际上是带有所有属性和方法的NodeList，并不是live的。
11.1.3 matchesSelector()方法
Selectors API Level 2规范为Element类型新定义了这个方法。即只有Element元素才有这个方法。这个方法接收一个CSS选择符作为参数，如果调用该元素的与该选择符匹配，返回true；否则返回false。
querySelector 和 querySelectorAll()方法的css选择器是绝对的！不相对于任何元素，甚至不会相对于调用它们的元素。 首先匹配查询条件，得到的元素再匹配子元素。
eg:
<img id="outside">
<div id="my-id">
<img id="inside">
<div class="lonely"></div>
<div class="outer">
<div class="inner"></div>
</div>
</div>
document.querySelector(‘#my-id‘).querySelectorAll(‘div div‘); 得到的是 div.lonely div.outer div.inner，因为这些元素都满足 div div的查询条件，并且它们都是 my-div的子元素。
document.querySelector(‘#my-id div div‘); 得到的是 div.inner。