JavaScript: FireFox – Support for IE outerHTML

I have a web page that calls a Web Service.  The Web Service returns HTML.  This HTML need to be updated in the web page.  This is a fairly easy process in IE:  obj.outerHTML = new HTML.  But, I also need to get this to work in Firefox.  At first I had a difficult time creating a solution, but after a little Googling and understanding range and createContexualFragment the pieces started to fall together. This is what I came up with.. 
 

function

SetOuterHTML(newHtml, obj) {

   if (obj.outerHTML) {

    obj.outerHTML = newHtml;

   }

   else{

      var r = obj.ownerDocument.createRange();

      r.setStartBefore(obj);

      var df = r.createContextualFragment(newHtml);

      obj.parentNode.replaceChild(df, obj);

   }
}
 
 
Resources:
How to read inner/outerHTML with NN6?
 

Introduction to Range

 
The Four Different inner/outer text/html Combinations
 

InnerHTML for Mozilla(See "View the entire Source" at bottom of page)

 
createContextualFragment( )
 
range.createContextualFragment
 
range
 
 

Leave a Reply

Your email address will not be published. Required fields are marked *