What is the Document Object Model (DOM)?

The Document Object Model (DOM) is a programming interface that represents an HTML or XML document, providing a structured representation of a web page's structure and content

How do you select an element from the DOM?

We are select an element from the DOM using many method's

  • getElementById()
  • getElementsByClassName()
  • getElementBysTagName()
  • querySelector()
  • querySelectorAll()
    • What is event delegation in the context of the DOM, and why is it useful?

    Event delegation in the context of the DOM is a technique where you attach a single event listener to a parent element, which then listens for events on its child elements, rather than attaching separate event listeners to each individual child element.

    How do you manipulate an element's attributes and styles using the DOM?

    Attributes

    • To get an attribute: `element.getAttribute('attributeName')`
    • To set an attribute: `element.setAttribute('attributeName', 'newValue')`
    • To remove an attribute: `element.removeAttribute('attributeName')`

      Style

    • To get a style: `element.style.propertyName` or `window.getComputedStyle(element).propertyName`
    • To set a style: `element.style.propertyName = 'newValue'`
    • To remove a style: `element.style.propertyName = ''`