>  기사  >  웹 프론트엔드  >  HTML 5 웹 저장소

HTML 5 웹 저장소

黄舟
黄舟원래의
2016-12-27 14:51:011260검색

클라이언트 측에 데이터 저장

HTML5는 클라이언트 측에 데이터를 저장하는 두 가지 새로운 방법을 제공합니다.

localStorage - 시간 제한 없는 데이터 저장

sessionStorage - 이전 세션

에 대한 데이터 저장은 모두 쿠키에 의해 수행되었습니다. 그러나 쿠키는 요청이 있을 때마다 서버에 전달되므로 쿠키가 느리고 비효율적이므로 대량의 데이터를 저장하는 데 적합하지 않습니다.

HTML5에서는 모든 서버 요청에 의해 데이터가 전달되지 않고, 대신 요청될 때만 데이터가 사용됩니다. 이를 통해 웹사이트 성능에 영향을 주지 않고 많은 양의 데이터를 저장할 수 있습니다.

웹사이트마다 데이터가 저장되는 위치가 다르며 웹사이트는 자체 데이터에만 액세스할 수 있습니다.

HTML5는 JavaScript를 사용하여 데이터를 저장하고 액세스합니다.

localStorage 방식

localStorage 방식으로 저장되는 데이터에는 시간 제한이 없습니다. 데이터는 다음 날, 다음 주 또는 연도 이후에도 계속 사용할 수 있습니다.

localStorage 생성 및 액세스 방법:

인스턴스

<script type="text/javascript">localStorage.lastname="Smith";document.write(localStorage.lastname);
</script>

다음 예에서는 사용자가 페이지를 방문하는 횟수를 계산합니다.

인스턴스

<script type="text/javascript">
if (localStorage.pagecount)
  {
  localStorage.pagecount=Number(localStorage.pagecount) +1;
  }
else
  {  localStorage.pagecount=1;
  }
document.write("Visits "+ localStorage.pagecount + " time(s).");
</script>

sessionStorage 메소드

sessionStorage 메소드는 세션에 대한 데이터를 저장합니다. 사용자가 브라우저 창을 닫으면 데이터가 삭제됩니다.

sessionStorage를 생성하고 액세스하는 방법:

인스턴스

<script type="text/javascript"> sessionStorage.lastname="Smith"; document.write(sessionStorage.lastname); </script>

다음 예에서는 사용자가 현재 세션에서 페이지를 방문하는 횟수를 계산합니다.

예제

<script type="text/javascript">
if (sessionStorage.pagecount)
  {
  sessionStorage.pagecount=Number(sessionStorage.pagecount) +1;
  }
else
  {  sessionStorage.pagecount=1;
  }
document.write("Visits "+sessionStorage.pagecount+" time(s) this session.");
</script>

위 내용은 HTML 5 Web Storage 내용입니다. 더 많은 관련 내용은 PHP 중국어 홈페이지(www.php.cn)를 참고해주세요!


성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.