Jak uzyskać tag HTML <html> za pomocą JavaScript / jQuery?

161

Korzystanie $('html').html()mogę dostać kod HTML wewnątrz <html>znacznika ( <head>, <body>etc.). Ale jak mogę uzyskać rzeczywisty kod HTML <html>tagu (z atrybutami)?

Alternatywnie, czy można pobrać cały kod HTML strony (w tym typ dokumentu <html>itp.) Za pomocą jQuery (lub zwykłego starego JavaScript)?

javascript jquery Justin Stayton
źródło

Odpowiedzi:

305

Najprostszym sposobem uzyskania htmlnatywnego elementu jest:

document.documentElement

Oto odniesienie: https://developer.mozilla.org/en-US/docs/Web/API/Document.documentElement .

AKTUALIZACJA: Aby następnie pobrać htmlelement jako ciąg, należy:

document.documentElement.outerHTML
Michael
źródło
1
Zobacz także to pytanie, aby uzyskać więcej informacji na temat documentElementzgodności z przeglądarkami: stackoverflow.com/q/11391827/177710 .
Oliver
Jak często otrzymujesz odwołanie do elementu html !? Ogólnie nie uważam, że wydajność powinna być problemem. W każdym razie, to jest właściwie lepsza odpowiedź, ale pojawiła się w SPOSÓB po przyznaniu nagrody.
posit labs
42

Oto jak uzyskać element HTML DOM wyłącznie za pomocą JS:

var htmlElement = document.getElementsByTagName("html")[0];

lub

var htmlElement = document.querySelector("html");

A jeśli chcesz użyć jQuery, aby uzyskać z niego atrybuty ...

$(htmlElement).attr(INSERT-ATTRIBUTE-NAME);
posit labs
źródło
Twoja odpowiedź byłaby znacznie lepsza, gdybyś mógł wyjaśnić, dlaczego to odpowiedział na pytanie. Podświetl również kod i kliknij {}przycisk lub naciśnij ctrl + k, aby oznaczyć go jako kod.
Ben
18

Oprócz niektórych innych odpowiedzi możesz również uzyskać dostęp do elementu HTML poprzez:

var htmlEl = document.body.parentNode;

Wtedy możesz uzyskać wewnętrzną zawartość HTML:

var inner = htmlEl.innerHTML;

Wydaje się, że wykonanie tego w ten sposób jest nieznacznie szybsze . Jeśli jednak otrzymujesz tylko element HTML, document.body.parentNodewydaje się , że jest to trochę szybsze .

Po utworzeniu elementu HTML możesz zepsuć atrybuty za pomocą metod getAttributei setAttribute.

W przypadku DOCTYPE można użyć document.doctype, co zostało szczegółowo omówione w tym pytaniu .

doubleswirve
źródło
4
Uwaga: to się nie powiedzie, jeśli treść nie jest jeszcze dostępna w dokumencie.
DataDink
3
W takim przypadku document.head.parentNodebędzie nadal działać, jeśli istnieje element głowy.
mahemoff
15

W jQuery:

var html_string = $('html').outerHTML()

W zwykłym JavaScript:

var html_string = document.documentElement.outerHTML
berkeleybross
źródło
4

jeśli chcesz uzyskać atrybut elementu HTML z jQuery, możesz użyć .attr();

więc $('html').attr('someAttribute');poda wartość someAttributeelementuhtml

http://api.jquery.com/attr/

Do tego:

tutaj jest wtyczka jQuery: http://plugins.jquery.com/project/getAttributes

który umożliwia pobranie wszystkich atrybutów z elementu HTML

jordanstephens
źródło
1
Projekt getAttributes () jest teraz nieco stary (luty 2009).
gligoran