Day 1: What is the DOM & Element Selection

Daily Objective

Understand the DOM tree representation and select elements using modern selectors.

1. Selecting Elements

// Single elements
const title = document.getElementById('main-title');
const firstButton = document.querySelector('.btn-primary');

// Multiple elements (NodeList)
const allCards = document.querySelectorAll('.card');
allCards.forEach(card => card.classList.add('shadow'));

Daily Hands-on Practice (70%)

1. Create an HTML page with multiple paragraphs and buttons.
2. Select them using querySelector and querySelectorAll and log them to console.