I recently ran across this problem when I was attempting to test some code that I was using for a client web site. I researched the error but there weren’t a whole lot of good articles on the problem. The error is fairly cryptic but here is the basic gist: the markup has some JavaScript code that tries to modify the parent node in the DOM from the a child node before the child is finished loading. Here’s a short example of a how to get the error:

<div id="parent">
  <div id="child">Child node content
    <script>
      document.getElementById('parent').innerHTML = 'New child';
    </script>
   </div>
</div>

The content will still be replaced but with a warning in the console. To get rid of the warning just move the script out to the parent container:

<div id="parent">
  <div id="child">Same child node content</div>
  <script
    document.getElementById('parent').innerHTML = 'New child';
  </script
</div>

The problem I was having was related to writing out the markup associated with FancyZoom div content. The same effect can be acheived by using body.onload or jQuery(document).ready, although I did notice that if you use onload() or .ready, if the page is not cached locally, you might have a FOUC (flash of unformatted content).

If you want more information about this problem head over to Microsoft’s support site.

« »