查詢選擇器

在現代瀏覽器 [1]中 ，可以使用類似 CSS 的選擇器來查詢文件中的元素 - 與 sizzle.js （由 jQuery 使用）相同。

querySelector

返回文件中與查詢匹配的第一個 Element 。如果沒有匹配，則返回 null。

// gets the element whose id="some-id"
var el1 = document.querySelector('#some-id');
 
// gets the first element in the document containing "class-name" in attribute class
var el2 = document.querySelector('.class-name');
 
// gets the first anchor element in the document
var el2 = document.querySelector('a');
 
// gets the first anchor element inside a section element in the document
var el2 = document.querySelector('section a');

querySelectorAll

返回包含文件中與查詢匹配的所有元素的 NodeList 。如果沒有匹配，則返回空的 NodeList。

// gets all elements in the document containing "class-name" in attribute class
var el2 = document.querySelectorAll('.class-name');
 
// gets all anchor elements in the document
var el2 = document.querySelectorAll('a');

// gets all anchor elements inside any section element in the document
var el2 = document.querySelectorAll('section a');