온라인 HTML 편집기

미리보기는 스크립트는 허용되지만 동일 출처 접근은 비활성화된 샌드박스 iframe 내에서 실행되므로, 미리보기의 코드는 이 페이지, 쿠키 또는 로컬 저장소를 읽거나 수정할 수 없습니다. 그래도 그 샌드박스 안에서는 다른 웹페이지와 마찬가지로 JavaScript를 자유롭게 실행하거나 경고 창을 열거나 네트워크 요청을 할 수 있으므로, 신뢰할 수 없는 소스에서 붙여넣은 코드는 새 브라우저 탭에서 실행하는 것과 같은 주의로 계속 다루세요.

이 도구는 CSS를 문서 head 내의 <style> 태그로 감싸고, HTML을 body에 직접 배치하며, JavaScript를 body 끝의 <script> 태그에 추가합니다. 이는 일반적인 단일 페이지 HTML 문서와 정확히 동일한 구성이며, 그렇게 결합된 문서를 미리보기에 로드합니다.

네, ".html로 다운로드" 버튼은 미리보기에 표시된 것과 정확히 동일한 결합 문서를 단일 index.html 파일로 저장하며, 브라우저에서 바로 열거나 웹 서버에 업로드할 수 있도록 준비됩니다.

네, 세 패널 중 하나에서 타이핑을 멈춘 직후 미리보기가 자동으로 새로고침되므로, 별도의 실행 버튼을 클릭하지 않고도 변경 사항의 효과를 확인할 수 있습니다.

미리보기는 실제로 분리된 브라우저 문서이므로 console.log 출력은 이 페이지가 아니라 그 문서 자체의 콘솔로 전달됩니다. 콘솔 출력을 보려면 브라우저의 개발자 도구를 열고 미리보기 iframe의 컨텍스트를 선택하거나, 대신 빠르게 눈에 보이는 확인을 위해 alert()를 사용하세요.