window.localStorage

 url로 다른 페이지로 넘어갈때 form을 통해서 넘기는 것은 너무 사치고 값만 넘겼으면 좋겠다고 생각했다.

처음 시도했던 방식은 url에 parameter로 넘겨서 GET으로 받는 것이였지만 구현 능력이 부족했나 성공하지 못했다.

다른 방식은 단순 js로 사용하는 방식이였는데 구글링을 통해 localStorage 방식을 알아냈다.(이제와서 보니 session으로 넘겼어도 될것 같기도..... )

sessionStorage의 데이터는 페이지 세션이 끝날때, 즉 페이지를 닫을때 사라지지만 localStorage의 데이터는 만료되지 않고 "사생활 보호" 탭이 닫힐 때 지워진다고 한다.

 

A라는 html 페이지에서 B라는 html 페이지로 day라는 값을 넘긴다고 가정해보자.

<script>
  // 메모 추가 버튼을 누를 때 Day 값을 memo.html로 넘기는 코드
  $('.memoBtn').click(function(){
   day = $(this).attr("id");
   window.localStorage.setItem('day',day);
  });

</script>

여기서 주목해야할 것은 window.localStorage.setItem(key, value) 함수이다.

 

이런 다음 받는 html에서 window.localStorage.getItem(key) 만 해주면 값을 받는 것을 볼 수 있다.

day = window.localStorage.getItem('day');