DOM - GunnarThorunnarson/FORR3JS05DU GitHub Wiki

DOM stendur fyrir Document Object Model og er forritunarviðmót sem gerir okkur kleift að búa til, breyta eða fjarlægja stak (e. element) eins og html og texta úr skjalinu (vefsíðu). Venjulega bætum við eða fjarlægjum CSS klasa með JavaScript, við breytum ekki CSS reglum en það er líka mögulegt.

  1. Browser environment
  2. JavaScript DOM (með quiz) (Section 1 - 6)

DOM tré

  1. DOM og CSSOM tré
  2. DOM nodes og elements:
    1. Node “abstract” class, serving as a base for DOM nodes. Provides common DOM node properties.
    2. Element base class for DOM elements (HTML, XML, SVG). Provides generic element methods.
    3. HTMLElement basic class for all HTML elements. Provides common HTML element methods.

NodeList og HTMLCollection

  • Bæði NodeList (live and static) og HTMLCollection eru safn of nodes.
  • NodeList getur innihaldið öll nodes (element, attribute, text, document, comment osfrv).
  • HTMLCollection inniheldur aðeins HTML elements (tags)
  • Nodelist og HTMLCollection hafa mismunandi aðferðir sem hægt er að nota. Við getum td. ekki notað t.d. push/pop/splice/filter og fleiri array aðferðir þar sem þetta eru ekki fylki.
  • NodeList objects eru static eða live
    • live: Breytingar í DOM er uppfært sjálfvirkt og aðgengilegt í safni (e. collection).
    • static: Breytingar í DOM hefur ekki áhrif á innihald í safni.
    • Öll HTMLCollections eru live
    document.querySelectorAll()  // Static NodeList
document.getElementsByTagName()  // HTMLCollection
document.getElementsByClassName()  // HTMLCollection

Æfingaverkefni