-
-
Save eligrey/1276030 to your computer and use it in GitHub Desktop.
/* | |
* insertAdjacentHTML.js | |
* Cross-browser full HTMLElement.insertAdjacentHTML implementation. | |
* | |
* 2011-10-10 | |
* | |
* By Eli Grey, http://eligrey.com | |
* Public Domain. | |
* NO WARRANTY EXPRESSED OR IMPLIED. USE AT YOUR OWN RISK. | |
*/ | |
if (self.document && !("insertAdjacentHTML" in document.createElementNS("http://www.w3.org/1999/xhtml", "_"))) { | |
HTMLElement.prototype.insertAdjacentHTML = function(position, html) { | |
"use strict"; | |
var | |
ref = this | |
, container = ref.ownerDocument.createElementNS("http://www.w3.org/1999/xhtml", "_") | |
, ref_parent = ref.parentNode | |
, node, first_child, next_sibling | |
; | |
container.innerHTML = html; | |
switch (position.toLowerCase()) { | |
case "beforebegin": | |
while ((node = container.firstChild)) { | |
ref_parent.insertBefore(node, ref); | |
} | |
break; | |
case "afterbegin": | |
first_child = ref.firstChild; | |
while ((node = container.lastChild)) { | |
first_child = ref.insertBefore(node, first_child); | |
} | |
break; | |
case "beforeend": | |
while ((node = container.firstChild)) { | |
ref.appendChild(node); | |
} | |
break; | |
case "afterend": | |
next_sibling = ref.nextSibling; | |
while ((node = container.lastChild)) { | |
next_sibling = ref_parent.insertBefore(node, next_sibling); | |
} | |
break; | |
} | |
}; | |
} |
If you need this for SVG, modify HTMLElement
to SVGSVGElement
and the namespace to http://www.w3.org/2000/svg
inside the function.
I also needed to replace the starting conditional to this(perhaps there is a better way though):
if(!SVGSVGElement.prototype.insertAdjacentHTML) {
Why would anyone need this anymore
Why would anyone need this anymore
I'm a bit late, but (believe it or not) it's because of a very tiny minority that still use browsers that don't support insertAdjacentHTML
.
IE11 doesn't support insertAdjacentHTML on SVG elements
Edge doesn't support insertAdjacentHTML on SVG elements, too
the svg element in ios version <= 10.2 doesn't support insertAdjacentHTML.
For IE 11 you should change
ref.ownerDocument.createElementNS("http://www.w3.org/1999/xhtml", "_") to ref.ownerDocument.createElementNS("http://www.w3.org/1999/xhtml", "svg"),
and import innersvg-polyfill for .innerHTML working.
Maybe helpfull this:
https://github.com/comindware/core-ui/blob/2.1/release/src/services/EdgeService.ts
https://github.com/comindware/core-ui/blob/2.1/release/src/services/IEService.ts
Thank you. I found this to be handy for old versions of Firefox.