[HTML] html에서 html로 데이터 전달하기

목업사이트를 만들면서 무료 배포를 위해 최대한 html, css, js만 사용해서 홈페이지를 만들려고 하고 있다.

서버에 저장하지 않고 페이지 이동시에 데이터를 전달할 수 있는 방법을 찾다가 기록해둔다.

1. url로 보내기

보내는 html

<script> 
  value1 = "Hello";
  value2 = "World";
  location.href="index.html?" + value1 + "," + value2;
</script>

받는 html

<script>
    temp = location.href.split("?");
    data = temp[1].split(",");
    value1 = data[0];
    value2 = data[1];
    document.write(value1 + " " + valule2);
</script>

• 매우 간편하고 단순한 방법이나 혼자 사용하는 게 아니라면 보안상으로도, 보기에도 역시 좋지 않다..
• 그리고 보내야하는 값이 많아졌을 때 일일이 값을 넣어줘야한다는 점이 불편하다.

2. LocalStrorage 사용하기

보내는 html

localStorage.setItem('key','value');

받는 html

var value = localStorage.getItem('key');

• HTML5에서 추가된 LocalStorage Window 객체의 하위 객체
• 영구 저장인 로컬 스토리지와 브라우저가 실행 중에만 유효한 세션 스토리지라는 두가지 저장 방식을 제공한다.