Skip to content

Instantly share code, notes, and snippets.

@eligrey
Last active April 11, 2024 10:34
Show Gist options
  • Save eligrey/1129031 to your computer and use it in GitHub Desktop.
Save eligrey/1129031 to your computer and use it in GitHub Desktop.
DOMParser HTML extension - Now a polyfill since HTML parsing was added to the DOMParser specification
/*
* DOMParser HTML extension
* 2019-11-13
*
* By Eli Grey, http://eligrey.com
* Public domain.
* NO WARRANTY EXPRESSED OR IMPLIED. USE AT YOUR OWN RISK.
*/
/*! @source https://gist.github.com/1129031 */
/*global document, DOMParser*/
(function(DOMParser) {
"use strict";
var DOMParser_proto = DOMParser.prototype;
var real_parseFromString = DOMParser_proto.parseFromString;
// Firefox/Opera/IE throw errors on unsupported types
try {
// WebKit returns null on unsupported types
if ((new DOMParser).parseFromString("", "text/html")) {
// text/html parsing is natively supported
return;
}
} catch (ex) {}
DOMParser_proto.parseFromString = function(markup, type) {
if (/^\s*text\/html\s*(?:;|$)/i.test(type)) {
var doc = document.implementation.createHTMLDocument("");
doc.documentElement.innerHTML = markup;
return doc;
} else {
return real_parseFromString.apply(this, arguments);
}
};
}(DOMParser));
@ryan-allen
Copy link

Awesome, works for me on iOS pulling whole pages and parsing them with XMLHttpRequest :)

@alirezahosseini1368
Copy link

I add this code In my scripts files and works fine but this code run several times , How can i prevent this ? maybe some codes simlar below codes

DOMParserFlag = false;
if (DOMParserFlag == false) {

function DOMParser() {
    "use strict";

..........

}
DOMParserFlag = true;

}

@rouki124
Copy link

@kube
Copy link

kube commented Nov 3, 2017

Setting .innerHTML will load image ressources (even if element is not appended to DOM), which is not the case with DOMParser.

@gustavom
Copy link

gustavom commented Nov 8, 2017

I remove this

if (markup.toLowerCase().indexOf('<!doctype') > -1) {
        console.log(markup);
        console.log('inserindo o elemento doc \n\n');
        //doc.documentElement.innerHTML = markup;
        doc.body.innerHTML = markup;
      } else {
        doc.body.innerHTML = markup;
      }

and i changed for this

doc.body.innerHTML = markup;

and I got the result I needed.

@pldilley
Copy link

@kube I tested and it seems that using document.implementation.createHTMLDocument("") creates a new document, which not being attached to any window prevents arbitrary execution of anything (at least in the latest Chrome):

var doc = document.implementation.createHTMLDocument("")
doc.documentElement.innerHTML = '<img src="ERROR" onerror="console.log(456)" />'

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment