document.getElementById() vs document.querySelector()
document.getElementById() and document.querySelector() are both JavaScript DOM APIs, and choosing between them is a common point of confusion. This page compares their syntax, parameters, return values, and typical use cases so you can pick the right one. document.getElementById(): Returns the element with the specified ID. Its syntax is document.getElementById(id). document.querySelector(): Returns the first matching element. Its syntax is document.querySelector(selectors). Example of document.getElementById(): document.getElementById("app"). Example of document.querySelector(): document.querySelector(".my-class"). Read the full references for document.getElementById() and document.querySelector() to see edge cases, time complexity, browser support, and the mistakes developers most often make with each. Other DOM APIs worth comparing: document.querySelectorAll(), element.addEventListener(), element.removeEventListener(), document.createElement(), element.appendChild(), element.removeChild(). Both belong to the DOM category in the JS Reference documentation, which covers 494 entries in total. Try both in the JavaScript playground to see the behavioral difference live.