The parentNode problem in IE7

For more context around this demo, visit: http://welcome.totheinter.net/2009/07/21/the-undocumented-life-of-javascripts-parentnode-property-internet-explorer-edition/.

When traversing the DOM in JavaScript in IE7 (possibly 6 and 8 too), the parentNode of a given node might not be correct. Specifically, when looking at all of a node's children, the children's parentNode might not point back to that original node.

To see this behavior in action:

  1. Download the sample.rtf and open it in WordPad
  2. Select all of the text in the document with Ctrl+A
  3. Paste into the TinyMCE below
  4. Click the [validate] button
  5. The nodes with the incorrect parentNode are highlighted in red, and the DOM tree is printed out below the TinyMCE instance.
  6. Notice the nodes with count=2 and scream in horror!

The structure of the DOM will be printed on the right, and the offending nodes will be wrapped in <error> tags