How do I get the entire page's HTML with jQuery?

Question

I used $(document).html(), but that threw an error... is there a way to get everything?

Patrick McElhaney · Answer 1 · 2021-04-22T01:09:36.863

Don't forget the <html> tag can have attributes too. If you want the whole document this should work.

 $('html')[0].outerHTML

It's also trivial without jQuery.

document.documentElement.outerHTML

If you also want to include the doctype, it's a little more involved.

var getDocTypeAsString = function () { 
    var node = document.doctype;
    return node ? "<!DOCTYPE "
         + node.name
         + (node.publicId ? ' PUBLIC "' + node.publicId + '"' : '')
         + (!node.publicId && node.systemId ? ' SYSTEM' : '') 
         + (node.systemId ? ' "' + node.systemId + '"' : '')
         + '>\n' : '';
};

getDocTypeAsString() + document.documentElement.outerHTML

Jimmie R. Houts · Accepted Answer · 2018-09-04T14:40:37.227

71

You could try:

$("html").html();

If you want to also capture the html tags you could concatenate them to the html like this:

function getPageHTML() {
  return "<html>" + $("html").html() + "</html>";
}

edited Sep 04 '18 at 14:40

answered Jun 11 '09 at 18:12

Jimmie R. Houts

7,728
2
31
38

how about getting the doctype? – Sebastian Patane Masuelli Aug 18 '12 at 17:59
@Sebastian Not sure if you can, see [this answer](http://stackoverflow.com/questions/3043820/jquery-check-doctype) – Jimmie R. Houts Aug 19 '12 at 01:16
This could work, but if you're replacing a page with a whole other page, you'll end up having multiple html tags. – Kirk Douglas Jr Feb 01 '18 at 17:12

score 4 · Answer 3 · answered Jun 11 '09 at 18:17

4

Use:

document.body.innerHTML

answered Jun 11 '09 at 18:17

Diodeus - James MacFarlane

112,730
33
157
176

2

If you want the entire document html you should use: `window.document.innerHTML` – simo Jul 16 '12 at 15:44
2

@simo: `document` doesn't have an `innerHTML` property in any browsers i still use. – cHao Jul 29 '13 at 22:27

score 3 · Answer 4 · answered Nov 09 '19 at 09:58

No need to lean on jQuery. The best and simplest approach is to use

new XMLSerializer().serializeToString(document)

which will always give you the contents of the entire page including DOCTYPE tag, and it is supported in all modern browsers: https://caniuse.com/#feat=xml-serializer

score 2 · Answer 5 · answered Jun 11 '09 at 18:12

2

$("html").html() would get everything but the outer most html tags.

answered Jun 11 '09 at 18:12

Max Schmeling

12,363
14
66
109

What does this anwer have more than the accepted answer? – Arad Alvand Nov 28 '18 at 13:40

How do I get the entire page's HTML with jQuery?

5 Answers5

Linked

Related