웹 페이지의 특정 부분만 파일로 저장하는 방법

이를 위해서는 숨어있는 IFRAME과 이를 이용한 간단한 자바스크립트 함수가 필요하다.

우선 결과부터 살펴 보자. 이 페이지에서 아래 TextArea에 있는 내용만 파일로 저장해 보도록 하자:



위 결과에 대한 코드는 다음과 같다:

<iframe id="SaveSomePart" style="display:none"></iframe>
 
<script language="javascript">
 
function SavePartAsFile(somePart){
  SaveSomePart.document.open("text/html","replace")
  SaveSomePart.document.write(somePart)
  SaveSomePart.document.close()
  SaveSomePart.focus()
  SaveSomePart.document.execCommand('SaveAs', null, 'SaveAsTest.html')
}
 
</script>
<form name="myForm">
    <p><textarea name="myText" rows="10" cols="50">(TextArea에 들어갈 내용...)</textarea><br><br>
    <input type="button" value="TextArea 내용만 파일로 저장" onClick="SavePartAsFile(document.myForm.myText.value)"></p>
</form>

위 코드에서의 핵심을 정리하면 다음과 같다:

  • 숨겨진 IFRAME을 하나 만든다.
  • 페이지 내에서 특정 부분만 저장하고 싶은 부분을 그 IFRAME에 write를 해준다.
  • 그 IFRAME을 이용하여 "다른 이름으로 저장" 메뉴를 실행시킨다.

간단하면서도 유용하게 사용할 수 있는 팁이다.

이 게시물을..


태초에 나는 개그이야기를 만들었다.
내말을 믿고 나를 따르면 천당,
내말을 믿지않고 나를 따르지 않으면 지옥,
나는 하늘나라(우주)에 사느니라.

그럼 난 외계인?