Implementing insertAdjacentHTML() using innerHTML

innerHTML.js

// This module defines Element.insertAdjacentHTML for browsers that don't 
// support it, and also defines portable HTML insertion functions that have
// more logical names than insertAdjacentHTML:
// Insert.before(), Insert.after(), Insert.atStart(), Insert.atEnd()
var Insert = (function() {
 // If elements have a native insertAdjacentHTML, use it in four HTML
 // insertion functions with more sensible names.
 if (document.createElement("div").insertAdjacentHTML) {
 return {
 before: function(e,h) {e.insertAdjacentHTML("beforebegin",h);},
 after: function(e,h) {e.insertAdjacentHTML("afterend",h);},
 atStart: function(e,h) {e.insertAdjacentHTML("afterbegin",h);},
 atEnd: function(e,h) {e.insertAdjacentHTML("beforeend",h);}
 };
 }
 // Otherwise, we have no native insertAdjacentHTML. Implement the same
 // four insertion functions and then use them to define insertAdjacentHTML.
 // First, define a utility method that takes a string of HTML and returns
 // a DocumentFragment containing the parsed representation of that HTML.
 function fragment(html) {
 var elt = document.createElement("div"); // Create empty element
 var frag = document.createDocumentFragment(); // Create empty fragment
 elt.innerHTML = html;
 while(elt.firstChild) // Move all nodes
 frag.appendChild(elt.firstChild); // from elt to frag
 return frag; // And return the frag
 }
 var Insert = {
 before: function(elt, html) {
 elt.parentNode.insertBefore(fragment(html), elt);
 },
 after: function(elt, html) {
 elt.parentNode.insertBefore(fragment(html),elt.nextSibling);
 },
 atStart: function(elt, html) {
 elt.insertBefore(fragment(html), elt.firstChild);
 },
 atEnd: function(elt, html) { elt.appendChild(fragment(html)); }
 };
 // Now implement insertAdjacentHTML based on the functions above
 Element.prototype.insertAdjacentHTML = function(pos, html) {
 switch(pos.toLowerCase()) {
 case "beforebegin": return Insert.before(this, html);
 case "afterend": return Insert.after(this, html);
 case "afterbegin": return Insert.atStart(this, html);
 case "beforeend": return Insert.atEnd(this, html);
 }
 };
 return Insert; // Finally return the four insertion function
}());