HTML5向Web API新引入了 document.querySelector()和document.querySelectorAll()兩個方法，都可以接收三種類型的參數：id(#)，class(,)，標簽，就像jquery選擇器，參數需要是合法的CSS選擇語法。
用起來更方便的從DOM中選取元素，功能類似於jquery的選擇器，這樣在寫原生js代碼的時候就方便了許多。
document.querySelector()
返回文檔中匹配指定的選擇器組的第一個元素(使用深度優先先序遍歷文檔的節點 | 並且通過文檔標記中的第一個元素，並按照子節點數量的順序迭代順序節點)。
語法：
element = document.querySelector(selectors);
其中：
1，element是一個element對象（DOM元素）。
2. selectors是一個字符串，包含一個或多個CSS選擇器，多個則以逗號分割。
例子：這個例子中，會返回當前文檔中第一個類名為‘myclass’的元素：
var el = document.querySelector(".myclass");
Document.querySelectorAll()
返回與指定的選擇器組匹配的文檔中的元素列表 (使用深度優先的先序遍歷文檔的節點)。返回的對象是 NodeList 。
語法：
elementList = document.querySelectorAll(selectors);
其中：
1， elementList是一個non-live的NodeList類型的對象；
2，selectors是由一個逗號連接的包含一個或多個CSS選擇器的字符串。
如果 selectors參數中包含 CSS偽元素，則返回一個空的elementList。
例子：
下面的例子返回一個文檔中所有的class為"note"或者 "alert"的div元素.
var matches = document.querySelectorAll("div.note, div.alert");