bi-04 step 01 — Build a DOM with correct ordering

Goal

mini-browser M3: a DOM whose mutation algorithms do the work real ones do — before the pointer update, not after.

Tasks

  1. Node, Element, Text, Document; parent/child/sibling links.
  2. appendChild, insertBefore, removeChild, remove with the checks the spec requires:
    • appending a node that already has a parent removes it from the old parent first,
    • appending an ancestor into its own descendant throws,
    • the hierarchy checks happen before any mutation.
  3. Attributes, plus a reflected-property layer for at least class and id. Make input.value diverge from its attribute, deliberately.
  4. Write down, before implementing: how many distinct things appendChild does before it changes a pointer. Then count them after. Most people guess two; the answer is closer to six.

Done when

  • All four mutation methods with correct ordering and error cases
  • Property/attribute divergence demonstrated for one form control
  • Your list of pre-mutation work compared against your prediction