Canh

Home

❯

Source Notes

❯

06 Competency Matrix For Frontend Developer

❯

DOM API

DOM API

May 04, 20251 min read

  • seed
  • technical

Basic

Details

  1. What is DOM?
  2. DOM main types and interfaces
  3. Finding/creating/updating/removing elements using DOM API.
  4. Using the “Elements” panel in Chrome DevTools

Links

  1. https://developer.mozilla.org/en-US/docs/Web/API/HTML_DOM_API
  2. https://developer.mozilla.org/en-US/docs/Web/API/Document_Object_Model/Introduction
  3. https://developer.mozilla.org/en-US/docs/Web/API/Document_Object_Model/Introduction#fundamental_data_types
  4. https://developer.mozilla.org/en-US/docs/Web/API/Document_Object_Model/Introduction#core_interfaces_in_the_dom
  5. https://developer.mozilla.org/en-US/docs/Web/API/Document_Object_Model/Examples
  6. https://blog.bitsrc.io/9-element-tab-features-in-chrome-devtools-for-effective-debugging-1b02aa8f000a

Courses

  1. https://www.youtube.com/watch?v=5fb2aPlgoys
  2. https://www.youtube.com/watch?v=0ik6X4DJKCc

Intermediate

Details

  1. Iframes, embedding
  2. Event bubbling and capturing, preventDefault
  3. DocumentFragment
  4. WebComponents, ShadowDOM
  5. Semantic Web

Links

  1. https://developer.mozilla.org/en-US/docs/Learn/HTML/Multimedia_and_embedding/Other_embedding_technologies
  2. https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Building_blocks/Events
  3. https://developer.mozilla.org/en-US/docs/Web/API/DocumentFragment
  4. https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_shadow_DOM
  5. https://developer.mozilla.org/en-US/docs/Glossary/Semantics

Graph View

  • Basic
  • Details
  • Links
  • Courses
  • Intermediate
  • Details
  • Links

Backlinks

  • Competency Matrix For Developer

Created with Quartz v4.5.0 © 2025

  • GitHub
  • X