Local Storage

Bài đăng này đã không được cập nhật trong 8 năm

1.HTML Local Storage là gì ?

Với local storeage web applications có thể lưu trữ dữ liệu tại trình duyệt của user,đây là một tính năng hưu ích trong HTML5 Trước HTML 5,dữ liệu của ứng dụng phải lưu trữ trong cookies,Local Storage thì bảo mật hơn và có thể lưu trữ nhiều dữ liệu mà không ảnh hưởng tới hiệu năng của website. Không giống như cookies,giới hạn lưu trữ dữ liệu của nó lớn hơn(it nhất là 5Mb) và thông tin không bao giờ được gửi tới server Local storage được sử dụng cho mỗi domain hoặc protocal.Tất cả các trang từ một ứng dung có thể lựu trữ và truy cập cung một data giống nhau

2.Các đối tượng local storeage

2.1 localStorage:lưu trữ dữ liệu mà ko có thời hạn
2.2 sessionStorage:lưu trữ dữ liệu trong một session và sẽ mất khi tab hiện tại bị đóng

3.cách sử dụng

3.1 các loại trình duyện hỗ trợ gồm có:Google 4.0,Microsoft Edge 8.0,Firefox 3.5,Safari 4.0,Opera 11.5.kiểm tra bằng dòng lệnh xem trình duyệt có hỗ trợ không bằng câu lệnh sau

     if (typeof(Storage) !== "undefined") {
        // Code for localStorage/sessionStorage.
     } else {
        // Sorry! No Web Storage support..
     }

3.2 Đối tượng localStorage:dữ liệu sẽ vẫn còn cho dù trình duyệt đã bị đóng

3.2.1 cú pháp sử dụng: -Để lưu trữ tại localStorage ta sử dụng chức năng setItem với hai tham số key và value,hoặc dùng Array hay object

    localStorage.setItem('name', 'thanh');

    localStorage.name = 'thanh';

    localStorage['name'] = 'thanh';

Để lấy ra giá trị đã lưu trữ ta sử dụng chức năng getItem()

    var name = localStorage.getItem('name');

Để xóa dữ liệu đã lưu trữ ta dùng cú pháp sau.

    localStorage.removeItem('name');

Áp dụng:

Có một giới hạn lưu trữ lượng dữ liệu mà bạn có thể lưu ở localStorage,nó phụ thược vào nhà cung cấp trình duyệt.Nếu ứng dụng của ban chỉ lưu trữ khoảng 2,5mb data tại localStorage thì có thể xem xet lưu trữ,còn nếu nhiều hơn thì phải xem xét lại.

3.3 Đối tương SessionStorage -cách sử dụng sessionStorage thì cũng tương tự như localStorage chỉ khác là khi bạn tắt tab đang hiện tại.Cú pháp

     Storing Data
     sessionStorage.setItem('name', 'thanh');

     Retrieving Data
     var name = sessionStorage.getItem('name');

     Deleting Data
     sessionStorage.removeItem('name');

     Retrieving an Item Key
     sessionStorage.key(name);

     Clearing the Datastore
     sessionStorage.clear();

Trên đây là giới thiệu sơ lược về cách sử dụng localStorage. Hy vọng sẽ giúp đỡ được các bạn trong công việc và học tập.

Tài liệu tham khảo http://www.w3schools.com/html/html5_webstorage.asp http://blog.teamtreehouse.com/storing-data-on-the-client-with-localstorage https://www.sitepoint.com/html5-local-storage-revisited/

HTML5

1.HTML Local Storage là gì ?

Mục lục