Document Object Model

Links: Book about DOM

6 flashcards · Programming Languages · by lakesare

1. How many types of nodes are there in DOM? Name 3.

   12 types ELEMENT_NODE (e.g. <body>, <a>, <p>, <script>, <style>, <html>, <h1> etc...) TEXT_NODE (e.g. text characters in an html) DOCUMENT_FRAGMENT_NODE (e.g. document.createDocumentFragment())

2. By what DOM nodes would this HTML be represented? <div>Hi</div>

   { elementNode: { nodeName: 'DIV', nodeType: 1, (== Element Node) nodeValue: null childNodes: [ { nodeName:"#text", nodeType: 3, (== Text Node), nodeValue: 'Hi' } ] } }

3. In DOM, how is text stored in Element Nodes?

   Element Nodes do not contain Text! Element Node has a child of type Text Node, which contains text.

4. What is DOM?

   Api (basically a collection of methods waiting to be implemented in some language) that treats HTML as a tree structure. [DOM is actually markup language (HTML, XML) and scripting language (Js) agnostic] Example of what DOM specifies: w3.

5. All node types inherit from Node, and Node inherits from Object.

   Object < Node < Element < HTMLElement Object < Node < Attr Object < Node < CharacterData < Text Object < Node < Document < HTMLDocument Object < Node < DocumentFragment Node is just a JavaScript constructor function. And so logically Node inherits from Object.prototype just like all objects in JavaScript.

6. What is DocumentFragment?

   It's an object inherited from Node. Light weight document DOM that is external to the live DOM tree. Think of a DocumentFragment as an empty document that acts just like the live DOM tree, but only lives in memory, and its child nodes can easily be manipulated in memory and then appended to the live DOM. Represents a minimal document object that has no parent. It is used as a light-weight version of Document to store a segment of a document structure comprised of nodes