Jak uzyskać cały dokument HTML jako ciąg znaków?

233

MS dodał outerHTML i innerHTML właściwości jakiś czas temu.

Zgodnie z MDN, outerHTML jest obsługiwany w przeglądarkach Firefox 11, Chrome 0.2, Internet Explorer 4.0, Opera 7, Safari 1.3, Android, Firefox Mobile 11, IE Mobile, Opera Mobile i Safari Mobile. outerHTML jest w specyfikacji DOM Parsing and Serialization.

Zapoznaj się z quirksmode, aby uzyskać zgodność z przeglądarką, co będzie dla Ciebie najlepsze. Wszystkie wsparcie innerHTML.

var markup = document.documentElement.innerHTML; 
alert(markup);

Źródło

2009-05-03 14:37:53

+14

outerHTML nie otrzymuje typu dokumentu. – CMCDragonkai

+0

pracował jak urok! Dziękuję Ci! czy istnieje sposób na pobranie rozmiaru wszystkich/wszystkich plików połączonych z dokumentem, w tym plików js i css? – www139

+0

@CMCDragonkai: Można [pobrać osobno dokumentację] (http://stackoverflow.com/a/10162353/157385) i wstawić go do łańcucha znaczników. Nie idealne, wiem, ale możliwe. –

37

Wierzę, że document.documentElement.outerHTML powinien zwrócić to za Ciebie.

Zgodnie z MDN, outerHTML jest obsługiwany w przeglądarkach Firefox 11, Chrome 0.2, Internet Explorer 4.0, Opera 7, Safari 1.3, Android, Firefox Mobile 11, IE Mobile, Opera Mobile i Safari Mobile. outerHTML jest w specyfikacji DOM Parsing and Serialization.

Strona MSDN na outerHTML property informuje, że jest obsługiwana w IE 5+. Odpowiedź Colina łączy się ze stroną quirksmode W3C, która oferuje dobre porównanie kompatybilności z różnymi przeglądarkami (również w przypadku innych funkcji DOM).

Źródło

2009-05-03 14:36:20 Noldorin

+0

Not wszystkie przeglądarki obsługują to. –

+0

@Colin: Tak, dobra uwaga. Z doświadczenia wiem, że zarówno IE 6+, jak i Firefox go obsługują, chociaż strona z linkami do quirksmode sugeruje inaczej ... – Noldorin

+0

Firefox nie obsługuje OuterHTML. Jest IE zastrzeżony. https://developer.mozilla.org/En/Migrate_apps_from_Internet_Explorer_to_Mozilla#Generate_and_manipulate_content –

5

document.documentElement.outerHTML

Źródło

2009-05-03 14:36:27

+1

Nie wszystkie przeglądarki to obsługują. –

+2

Obsługiwane w przeglądarce Firefox 11, Chrome 0.2, Internet Explorer 4.0, Opera 7, Safari 1.3, Android, Firefox Mobile 11, IE Mobile, Opera Mobile i Safari Mobile ([MDN] (https://developer.mozilla.org/en -US/docs/DOM/element.outerHTML)). 'outerHTML' znajduje się w specyfikacji [DOM Parsing and Serialization] (http://domparsing.spec.whatwg.org/#outerhtml). – XP1

+0

Odpowiedź Colina jest bardziej szczegółowa. –

3

document.documentElement.innerHTML

Źródło

2009-05-03 14:37:47 cherouvim

+0

To nie zwraca znacznika ''. –

-4

Prawidłowy sposób jest rzeczywiście:

webBrowser1.DocumentText

Źródło

2010-10-29 15:05:31 Damiano

+2

Tylko jeśli hostujesz stronę w formancie WinForms WebBrowser ... –

1

Zawsze używam

document.getElementsByTagName('html')[0].innerHTML

Prawdopodobnie nie właściwa droga, ale mogę to zrozumieć, gdy widzę go.

Źródło

2011-03-31 23:43:19

+0

Jest to niepoprawne, ponieważ nie zwróci znacznika ''. –

9

Można również zrobić:

document.getElementsByTagName('html')[0].innerHTML

Nie dostaniesz doctype lub tag HTML, ale wszystko inne ...

Źródło

2011-06-16 14:04:01 Hakan

4

prawdopodobnie tylko IE:

>  webBrowser1.DocumentText

dla FF górę od 1.0:

//serialize current DOM-Tree incl. changes/edits to ss-variable 
var ns = new XMLSerializer(); 
var ss= ns.serializeToString(document); 
alert(ss.substr(0,300));

może pracować w FF. (Pokazuje BARDZO PIERWSZE 300 znaków z BARDZO początkującego tekstu źródłowego, głównie doctype-defs.)

ALE należy pamiętać, że normalny "Zapisz jako" -Dialog z FF MIGHT NIE zapisuje bieżący stan strona, raczej oryginalnie załadowany tekst X/h/tml-source !! (POST-up ss do jakiegoś pliku tymczasowego i przekierowanie do niego może dostarczyć zapisany tekst źródłowy z wcześniejszymi zmianami/edycjami).

Chociaż FF zaskakuje dobrym odzyskiem na "powrót" i NICE włączenie stanów/wartości w "Zapisz (jako) ..."dla pól wejściowych podobny, textarea itd., A nie od elementów contentEditable/designMode ...

jeśli nie xhtml- resp. Pliku XML (typu MIME, a nie tylko do nazwy pliku rozszerzenie!), można użyć document.open/write/close, aby ustawić zawartość pliku do warstwy źródłowej, która zostanie zapisana w oknie dialogowym zapisu użytkownika z menu Plik/Zapisz w FF. zobacz: http://www.w3.org/MarkUp/2004/xhtml-faq#docwrite lub

https://developer.mozilla.org/en-US/docs/Web/API/document.write

Neutralny na pytania X (hT) ML, spróbuj "view-source: http: // ..." jako wartości src-attrib od An (skrypt wykonany !?) iframe, - aby uzyskać dostęp do dokumentu iframes w FF:

<iframe-elementnode>.contentDocument, patrz google "mdn contentDocument" dla apletu. członkowie, na przykład "textContent". "Tyle lat temu nie lubiłem się czołgać. Jeśli nadal jest pilna potrzeba, wspomnij o tym, że muszę nurkować w ...

Źródło

2014-03-13 03:55:53 dos

26

Próbowałem różnych odpowiedzi, aby zobaczyć, co jest zwracane. Używam najnowszej wersji Chrome.

Sugestia document.documentElement.innerHTML; powrócił <head> ... </body>

Gaby sugestia document.getElementsByTagName('html')[0].innerHTML; powrócił samo.

Sugestia zwróciła <html><head> ... </body></html> , która jest wszystkim oprócz "dokumentu".

można pobrać obiekt doctype z document.doctype; ta zwraca obiekt, a nie ciąg znaków, więc jeśli trzeba wyodrębnić szczegóły jak ciągi dla wszystkich doctypes włącznie HTML5 jest to opisane tutaj: Get DocType of an HTML as string with Javascript

I chciał tylko HTML5, dzięki czemu następuje było dla mnie za mało, aby utworzyć cały dokument:

alert('<!DOCTYPE HTML>' + '\n' + document.documentElement.outerHTML);

Źródło

2014-11-13 09:58:30 paulo62

+0

To jest najbardziej kompletna odpowiedź i powinna zostać zaakceptowana. Od 2016 roku zgodność z przeglądarką jest kompletna, a jej szczegółowe omówienie (jak w obecnie akceptowanej odpowiedzi) nie jest już konieczne. –

0

Zastosowanie document.documentElement.

samo pytanie odpowiedział tutaj: https://stackoverflow.com/a/7289396/2164160

Źródło

2015-05-06 07:10:30

+0

To pytanie powinno zostać zamknięte jako prawie duplikat tego, który jest znacznie starszy. W każdym razie interesujące jest to, że potrzebujesz '.outerHTML' i uzyskać' document.doctype', a najbardziej kompletną odpowiedzią jest [Paolo's] (http://stackoverflow.com/a/26905999/1269037). –

25

Można zrobić

new XMLSerializer().serializeToString(document)

w przeglądarkach nowsze niż IE 9.

Źródło

2016-03-10 13:01:38

+2

To była * pierwsza * ** poprawna odpowiedź ** zgodnie ze znacznikami daty/czasu. Części strony takie jak deklaracja XML * nie * zostaną uwzględnione, a przeglądarki będą manipulować kodem podczas korzystania z innych "odpowiedzi". Jest to * tylko * post, który powinien zostać poddany pod głosowanie (DOS jest opublikowany trzy dni później). Ludzie muszą zwracać uwagę! – John

+1

To nie jest całkowicie poprawne, ponieważ serializujeToString wykonuje kodowanie HTML. Na przykład, jeśli twój kod zawiera style definiujące czcionki, takie jak "Times New Roman", Times, serif, cytaty będą kodowane html. Być może nie jest to ważne dla niektórych z was, ale dla mnie jest to ... – Marko

+0

@John oraz OP faktycznie prosi o "cały HTML _within_ tagów html". A wybrana najlepsza odpowiedź Colina Burnetta pozwala to osiągnąć. Ta konkretna odpowiedź (Erika) będzie zawierać znaczniki html i doctype. To powiedziawszy, był to dla mnie absolutny diament i dokładnie to, czego szukałem! Twój komentarz też pomógł, ponieważ dzięki temu mogłem poświęcić więcej czasu na tę odpowiedź, więc dziękuję :) – evanrmurphy

Jak uzyskać cały dokument HTML jako ciąg znaków?

Odpowiedz

Powiązane problemy