새 창에서 Textarea로 전체 문서 미리보기

Question

HTML/CSS/JS 파일을 온라인 및 오프라인으로 작성하기위한 간단한 코드 편집기를 만들고 있습니다. 지금까지 모든 것이 훌륭해졌지만 편집기, doctype 및 모두에 입력 된 전체 HTML 문서를 정확하게 미리 보는 방법을 파악하려고합니다. 지금까지 편집기의 경우 "새 탭에서 열기"를 사용하여 입력 한 문서를 새 창에 열 수 있습니다.

그러나 내가 원하는 방식으로 작동하도록 만든 유일한 방법은 base64로 인코딩 된 HTML 파일을 사용하게하여 전체 문서를 창, doctype 및 모두에 출력 할 수있게하는 것입니다.

내가 사용한 말은 previewWinRef.document.write(editor.value)입니다. 작동하지 않습니다. 그것을 시도한 후에, 모든 것은 현재 문서에 추가되었습니다.

전체 미리보기 창의 내용을 지우고 편집기 텍스트 영역의 전체 값을 미리보기 창에 base64 인코딩없이 쓸 수 있습니까?

[편집] : 여기 무엇 코드에서 어떤 일이 일어나고있다 :

editor.addEventListener('keydown',function(event){ 
      setTimeout(function(){ 
       if(previewWinRef){ 
        previewWinRef.location = "data:text/html;base64,"+Base64.encode(editor.value); 
       } 
      },100); 
     }); 

는 기본적으로 나는 결과에게 당신이 아래로 키를 누르면마다 상쾌 해요, 당신이 이동하여 미리보기 창을 열 경우에만 파일 -> 새 탭에서 열기. 웬일인지, 미리보기 윈도우의 문서에 접근 할 수없는 것처럼 보입니다. 에디터 윈도우가 그것을 만들었지 만 그것은 단지 데이터 URL 일뿐입니다. 창 {}Screenshot

Here is the editor.

Answer 1

이 시도 : 업데이트

var win = window.open("about:blank", "title"); 
win.document.getElementsByTagName("html")[0].innerHTML = document.body.getElementsByTagName("textarea")[0].value; 

Answer 2

원래 대답.

새 탭에서 문서 개체의 documentElement 속성을 사용할 수 있습니다. 새로운 탭의 도메인이 다른 사이트 (또는 귀하의 경우 데이터 문자열)로 설정된 경우 일부 브라우저는 동일한 출처 정책 위반에 대해 불만을 토로합니다.

previewWinRef = window.open("about:blank"); 
previewWinRef.document.documentElement.innerHTML = editor.value;