HTML5 로컬 스토리지의 자세한 웹 저장

HTML5가 나타나기 전에 개발자가 클라이언트에 소량의 데이터를 저장 해야하는 경우 쿠키를 통해서만 구현할 수 있지만 쿠키에는 몇 가지 불충분 한 점이 있습니다.

• 각 도메인 이름의 쿠키 크기는 4KB로 제한됩니다.

• 쿠키는 각 HTTP 요청에 포함되므로 중복 데이터가 발생합니다.

• 쿠키에는 네트워크 전송 중에 암호화가 없으며 숨겨진 안전 위험이 있습니다.

웹 스토리지 기능은 HTML5에 추가됩니다. 공식 웹 스토리지는 각 웹 사이트가 5MB이며 쿠키보다 더 많은 데이터를 저장할 수 있으며 쿠키보다 더 강력한 기능을 제공합니다. 웹 스토리지는 이제 Firefox, Opera, Chrome, Safari의 주류 브라우저의 지원을 받았습니다.

웹 스토리지는 세션 스토리지 및 로컬 스토리지로 나뉩니다.

Window 객체는 세션 스토리지 및 로컬 스토리지를 각각 나타내는 SessionStorage 및 LocalStorage의 두 가지 속성을 제공합니다. 이 두 기능과 사용량은 거의 동일하지만 데이터 저장을위한 생존 기간이 다릅니다. Storage는 다음 속성과 방법을 제공합니다 (예 : LocalStorage를 예로 들어보십시오).

• LocalStorage.length : 키 값 쌍의 수를 얻습니다.

• LocalStorage.key (색인) : 인덱스 인덱스의 인덱스를 얻는 키;

• localStorage.getItem (키) : 지정된 키에 해당하는 값을 가져옵니다.

• localStorage.setItem (키, 값) : 지정된 키 값 쌍을 저장합니다.

• localStorage.removeItem (키) : 지정된 키에 해당하는 키 값의 키 값 쌍을 삭제합니다.

• localStorage.clear () : 모든 키 값 쌍을 삭제합니다.

다시 말해서, 웹 스토리지의 API는 문자열이어야한다는 점에 유의해야합니다. 따라서 문자열이 아닌 일부 데이터는 JSON 및 기타 방법을 통해 문자열 형식으로 변환 할 수 있습니다.

우리는 작은 프로그램을 통해 관련 속성 및 방법의 기본 사용에 익숙합니다.

• 학생들을 입력하는 기본 정보 (학교 번호, 이름, 성적, 성별 수 포함)는 학교 번호를 지역 저장소에 저장할 핵심 가치로 사용합니다.

• 학교 번호를 통해 학생들의 기본 정보를 문의하십시오.

• 모든 학생들의 정보를 보여줍니다.

우선, 우리는 HTML 페이지를 설계합니다