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)?

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

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);

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 .


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

Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.