Full-stack Web Technologies

CHAPTER 5
Element Queries

Get Elements By

Three document methods let us search for elements in the 3 most typical ways:

  • getElementsByTagName(tag): (plural!) find all paragraphs, or all h1s.
  • getElementById(id): (singular!) find the element with a certain id.
  • getElementsByClassName(class): (plural!) find all elements with a certain class.

Query Selector

Two other methods let us search using CSS selectors, which are more powerful. This methods were introduced around 2008 to mirror the functionality that at the time provided a library called jQuery, which still exists:

  • querySelector(sel): Find the first element matching selector sel.
  • querySelectorAll(sel): Find all elements matching selector sel.