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.

Ítarefni: javascript.info: DOM


DOM tré

  1. BOM
  2. DOM and CSSOM trees
  3. Yfirlit yfir 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.

DOM Tree


NodeList og HTMLCollection

NodeList (live and static) and HTMLCollection

  • Bæði NodeList 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