DOM Implementation and Scriptability

  • Revision slug: DOM_Implementation_and_Scriptability
  • Revision title: DOM Implementation and Scriptability
  • Revision id: 179513
  • Created:
  • Creator: Spanglerco
  • Is current revision? No
  • Comment Document migrated from http://www.mozilla.org/docs/dom/dom-talk/index.html

Revision Content

What is the DOM?

  • API for access and manipulation of a markup document
  • Started as DOM0, NS3 & IE3
  • Evolved into W3C DOM Level 1 Core + HTML
  • Kept going to Level 2 and Level 3...

What's standardized?

  • The document object
  • Elements, Text nodes, Comment, Style objects...
  • HTML DOM
  • Range, Traversal
  • ...

What's not?

  • The window object
  • Proprietary properties
document.all
document.location
element.offset*
element.innerHTML
element.scroll*
...
  • JS-isms
    • Variable number and types of arguments
    • Dynamic element lookup on the document object and form objects
    • Scoping and lookup order

The Mozilla DOM

  • Tries to be as W3C DOM compliant as possible
  • Tries to be as backwards compatible as possible (except for document.layers)
  • Mozilla DOM objects are XPCOM objects
  • XPIDL interfaces, "nsIDOM" prefixed, some already frozen
  • DOM objects are refcounted, DOM object wrapper lifetime is managed by the JS GC.

The Mozilla document tree

  • Document classes
    • nsDocument, nsHTMLDocument, and nsXULDocument
    • Internal interface is nsIDocument
  • Element classes
    • nsGenericElement (nsGenericContainerElement) nsHTML*Element, nsXMLElement, nsXULElement
    • Internal interface is nsIContent n' friends
  • Data node classes
    • nsGenericDOMDataNode
    • nsTextNode, nsCommentNode, nsCDATASection, nsProcessingInstruction, nsDocumentType, ...
    • Internal interface is nsITextContent (nsIContent)
  • "Tearoff" classes
    • 3Node and EventTarget on elements and data nodes

The Mozilla "window" object

Scriptability in Mozilla

  • Used to be done with static generated C/C++ code (IDLC) that hooked the DOM objects into the JS environment.
  • Now done using XPConnect and additional JS specific support code.

XPConnect and the DOM

  • XPConnect - the XPCOM/JS glue
  • Deals with the refcount/GC memory management models

nsIClassInfo

Exposes:

  • Class name
  • Implemented interfaces
  • Language specific helpers
  • Class flags (threading, singleton, ...)

Scriptable helpers

  • nsIXPCScriptable (XPConnect hooks, JS specific)
  • Dynamic name resolution
  • Property get/set/enum/... hooks

Scriptable helpers, wrapper parenting

  • JS object parent chain to match DOM object parent chain
  • DOM objects w/o a parent are parented at the global object

Scriptable helpers, wrapper prototype setup

  • Initial DOM wrapper prototype chain (done by XPConnect)
XPC wrapper -> XPC wrapper proto -> Object
  • DOM wrapper prototype chain done by the helper
XPC wrapper -> XPC wrapper proto -> {{mediawiki.external('class proto')}}* -> Object

Security and the DOM

  • Default security model is same-origin
  • Security checks done on all objects
  • Special security code for access to script globals

The Mozilla DOM vs. the IE DOM

  • No document.all
  • No window.event, and different interface for event objects
  • IE exposes elements by id in the global namespace
  • Different property lookup order (i.e. form.submit() and <input name="submit">)

Original Document Information

  • Author: Johnny Stenback

Revision Source

<h3 name="What_is_the_DOM.3F"> What is the DOM? </h3>
<ul><li> API for access and manipulation of a markup document
</li><li> Started as DOM0, NS3 &amp; IE3
</li><li> Evolved into W3C DOM Level 1 Core + HTML
</li><li> Kept going to Level 2 and Level 3...
</li></ul>
<h3 name="What.27s_standardized.3F"> What's standardized? </h3>
<ul><li> The document object
</li><li> Elements, Text nodes, Comment, Style objects...
</li><li> HTML DOM
</li><li> Range, Traversal
</li><li> ...
</li></ul>
<h3 name="What.27s_not.3F"> What's not? </h3>
<ul><li> The window object
</li><li> Proprietary properties
</li></ul>
<blockquote><code>document.all<br>
document.location<br>
element.offset*<br>
element.innerHTML<br>
element.scroll*<br>
...</code></blockquote>
<ul><li> JS-isms
<ul><li> Variable number and types of arguments
</li><li> Dynamic element lookup on the document object and form objects
</li><li> Scoping and lookup order
</li></ul>
</li></ul>
<h3 name="The_Mozilla_DOM"> The Mozilla DOM </h3>
<ul><li> Tries to be as W3C DOM compliant as possible
</li><li> Tries to be as backwards compatible as possible (except for document.layers)
</li><li> Mozilla DOM objects are XPCOM objects
</li><li> XPIDL interfaces, "nsIDOM" prefixed, some already frozen
</li><li> DOM objects are refcounted, DOM object wrapper lifetime is managed by the JS GC.
</li></ul>
<h3 name="The_Mozilla_document_tree"> The Mozilla document tree </h3>
<ul><li>  Document classes
<ul><li> nsDocument, nsHTMLDocument, and nsXULDocument
</li><li> Internal interface is nsIDocument
</li></ul>
</li><li> Element classes
<ul><li> nsGenericElement (nsGenericContainerElement) nsHTML*Element, nsXMLElement, nsXULElement
</li><li> Internal interface is nsIContent n' friends
</li></ul>
</li><li> Data node classes
<ul><li> nsGenericDOMDataNode
</li><li> nsTextNode, nsCommentNode, nsCDATASection, nsProcessingInstruction, nsDocumentType, ...
</li><li> Internal interface is nsITextContent (nsIContent)
</li></ul>
</li><li> "Tearoff" classes
<ul><li> 3Node and EventTarget on elements and data nodes
</li></ul>
</li></ul>
<h3 name="The_Mozilla_.22window.22_object"> The Mozilla "window" object </h3>
<ul><li> <a href="en/NsIDOMWindow">nsIDOMWindow</a>, frozen official interface
</li><li> <a href="en/NsIDOMWindowInternal">nsIDOMWindowInternal</a>, internal interface, not frozen
</li><li> <a href="en/NsIDOMChromeWindow">nsIDOMChromeWindow</a>, chrome specific window interface
</li><li> <a href="en/NsIDOMJSWindow">nsIDOMJSWindow</a>, JS specific window hooks
</li></ul>
<h3 name="Scriptability_in_Mozilla"> Scriptability in Mozilla </h3>
<ul><li> Used to be done with static generated C/C++ code (IDLC) that hooked the DOM objects into the JS environment.
</li><li> Now done using XPConnect and additional JS specific support code.
</li></ul>
<h3 name="XPConnect_and_the_DOM"> XPConnect and the DOM </h3>
<ul><li> XPConnect - the XPCOM/JS glue
</li><li> Deals with the refcount/GC memory management models
</li></ul>
<h3 name="nsIClassInfo"> nsIClassInfo </h3>
<p>Exposes:
</p>
<ul><li> Class name
</li><li> Implemented interfaces
</li><li> Language specific helpers
</li><li> Class flags (threading, singleton, ...)
</li></ul>
<h3 name="Scriptable_helpers"> Scriptable helpers </h3>
<ul><li> <a href="en/NsIXPCScriptable">nsIXPCScriptable</a> (XPConnect hooks, JS specific)
</li><li> Dynamic name resolution
</li><li> Property get/set/enum/... hooks
</li></ul>
<h3 name="Scriptable_helpers.2C_wrapper_parenting"> Scriptable helpers, wrapper parenting </h3>
<ul><li> JS object parent chain to match DOM object parent chain
</li><li> DOM objects w/o a parent are parented at the global object
</li></ul>
<h3 name="Scriptable_helpers.2C_wrapper_prototype_setup"> Scriptable helpers, wrapper prototype setup </h3>
<ul><li> Initial DOM wrapper prototype chain (done by XPConnect)
</li></ul>
<blockquote><code>XPC wrapper -&gt; XPC wrapper proto -&gt; Object</code></blockquote>
<ul><li> DOM wrapper prototype chain done by the helper
</li></ul>
<blockquote><code>XPC wrapper -&gt; XPC wrapper proto -&gt; {{mediawiki.external('class proto')}}* -&gt; Object</code></blockquote>
<h3 name="Security_and_the_DOM"> Security and the DOM </h3>
<ul><li> Default security model is same-origin
</li><li> Security checks done on all objects
</li><li> Special security code for access to script globals
</li></ul>
<h3 name="The_Mozilla_DOM_vs._the_IE_DOM"> The Mozilla DOM vs. the IE DOM </h3>
<ul><li> No document.all
</li><li> No window.event, and different interface for event objects
</li><li> IE exposes elements by id in the global namespace
</li><li> Different property lookup order (i.e. form.submit() and &lt;input name="submit"&gt;)
</li></ul>
<div class="originaldocinfo">
<h2 name="Original_Document_Information"> Original Document Information </h2>
<ul><li> Author: Johnny Stenback
</li></ul>
</div>
Revert to this revision