[javascript] 전체 문서 HTML을 문자열로 얻는 방법?

JAVASCRIPT / 글쓴이

JS에서 html 태그 내의 전체 HTML을 문자열 로 가져 오는 방법이 있습니까?

document.documentElement.??

답변

MS는 얼마 전에 outerHTMLand innerHTML속성을 추가했습니다 .

에 따르면 MDN , outerHTML파이어 폭스 (11), 크롬 0.2, 인터넷 익스플로러 4.0, 오페라 7, 사파리 1.3, 안드로이드, 파이어 폭스 모바일 (11), IE 모바일, 오페라 모바일, 사파리 모바일에서 지원됩니다. outerHTML에 DOM 구문 분석 및 직렬화 사양입니다.

적합한 기능에 대한 브라우저 호환성 은 quirksmode 를 참조하십시오 . 모든 지원 innerHTML.

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

답변

넌 할 수있어

new XMLSerializer().serializeToString(document)

IE 9보다 새로운 브라우저에서

참조 https://caniuse.com/#feat=xml-serializer를

답변

나는 document.documentElement.outerHTML당신을 위해 그것을 반환해야 한다고 생각 합니다.

에 따르면 MDN , outerHTML파이어 폭스 (11), 크롬 0.2, 인터넷 익스플로러 4.0, 오페라 7, 사파리 1.3, 안드로이드, 파이어 폭스 모바일 (11), IE 모바일, 오페라 모바일, 사파리 모바일에서 지원됩니다. outerHTML에 DOM 구문 분석 및 직렬화 사양입니다.

outerHTML속성 의 MSDN 페이지 는 IE 5 이상에서 지원된다고 설명합니다. Colin의 답변은 W3C quirksmode 페이지로 연결되며, 브라우저 간 호환성 (다른 DOM 기능의 경우도)을 잘 비교할 수 있습니다.

답변

나는 반환 된 것을보기 위해 다양한 답변을 시도했습니다. 최신 버전의 Chrome을 사용하고 있습니다.

제안이 document.documentElement.innerHTML;돌아 왔습니다<head> ... </body>

개비의 제안 document.getElementsByTagName('html')[0].innerHTML;은 똑 같았다.

제안은 document.documentElement.outerHTML;반환 <html><head> ... </body></html>
‘DOCTYPE’에서 떨어져 모든이다.

doctype 객체를 사용하여 검색 할 수 있습니다 document.doctype; : 당신은 모든 않은 doctype에 대한 문자열로 세부 사항을 추출하고, HTML5를 포함한이 여기에 설명이 필요 그렇다면,이 반환 객체가 아닌 문자열을 자바 스크립트로 문자열로 가져 오기에서 DocType하는 HTML의를

HTML5 만 원했기 때문에 다음과 같이 전체 문서를 작성하기에 충분했습니다.

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

답변

당신은 또한 할 수 있습니다 :

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

Doctype 또는 html 태그는 얻지 않지만 그 밖의 모든 것은 …

답변

document.documentElement.outerHTML

답변

아마도 IE 만 :

>     webBrowser1.DocumentText

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

FF에서 작동 할 수 있습니다. (매우 doctype-defs 인 소스 텍스트의 아주 처음부터 VERY FIRST 300자를 표시합니다.)

그러나 FF의 일반적인 “다른 이름으로 저장”-대화 상자는 페이지의 현재 상태를 저장하지 않고 원래로드 된 X / h / tml-source-text를 저장할 수는 없습니다 !! (일부 임시 파일로 ss를 POST하고 해당 파일로 리디렉션하면 이전에 변경 / 편집 한 내용으로 저장 가능한 소스 텍스트를 제공 할 수 있습니다.)

FF는 “back”에 대한 훌륭한 회복과 input-like FIELDS, textarea 등에 대한 “Save as as …”에 상태 / 값의 NICE 포함으로 인해 contenteditable / designMode의 요소가 아니라 놀랍지 만 …

xhtml이 아닌 경우. xml-file (파일 이름 확장명이 아닌 mime-type!), app.open/write/close를 사용하여 appr을 설정할 수 있습니다. FF의 파일 / 저장 메뉴에서 사용자의 저장 대화 상자에 저장 될 소스 계층에 콘텐츠를 저장합니다. 다음을 참조하십시오 :
http://www.w3.org/MarkUp/2004/xhtml-faq#docwrite resp.

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

X (ht) ML의 질문에 중립을두고, (script-made !?) iframe의 src-attrib 값으로 “view-source : http : // …”를 사용해보십시오.-iframe에 액세스하려면- FF 문서 :

<iframe-elementnode>.contentDocumentappr에 대해서는 Google “mdn contentDocument”를 참조하십시오. 예를 들어 ‘textContent’와 같은 멤버 ‘몇 년 전만해도 크롤링을 좋아하지 않습니다. 여전히 긴급한 필요가 있다면 이것을 언급해야합니다 …