Cửa sổ DOM HTML Thuộc tính localStorage
Cải thiện bài viết
Lưu bài viết
Thích bài viết
- Cập nhật lần cuối. 25 tháng 11 năm 2021
Cải thiện bài viết
Lưu bài viết
HTML DOM Window localStorage Properties cho phép bạn lưu trữ các cặp giá trị trong trình duyệt web bằng các đối tượng. Nó là một chỉ đọc
tài sản. Đối tượng này không hết hạn ngay cả khi đóng trình duyệt. Vì vậy, dữ liệu không bao giờ bị mất
Giá trị trả về. Nó trả về một đối tượng Lưu trữ
cú pháp
TIẾT KIỆM dữ liệu vào localStorage bằng cách sử dụng
localStorage.setItem["key", "value"];
ĐỌC dữ liệu từ localStorage bằng cách sử dụng
var name = localStorage.getItem["key"];
XÓA dữ liệu khỏi localStorage bằng cách sử dụng
localStorage.removeItem["key"];
Ví dụ 1. Ví dụ này mô tả Lưu, Đọc và Xóa dữ liệu vào localStorage
HTML
var name = localStorage.getItem["key"];1
var name = localStorage.getItem["key"];1
localStorage.removeItem["key"];1
var name = localStorage.getItem["key"];1
localStorage.removeItem["key"];3
var name = localStorage.getItem["key"];1
localStorage.removeItem["key"];5
localStorage.removeItem["key"];6
localStorage.removeItem["key"];7
localStorage.removeItem["key"];6
localStorage.removeItem["key"];9
var name = localStorage.getItem["key"];1
12
var name = localStorage.getItem["key"];1____52_______4
var name = localStorage.getItem["key"];1____52_______6
localStorage.removeItem["key"];6
8localStorage.removeItem["key"];6
8
>
9
0>
var name = localStorage.getItem["key"];1_______53_______
4>
localStorage.removeItem["key"];6
7localStorage.removeItem["key"];6
9localStorage.removeItem["key"];1
html
9
4>
var name = localStorage.getItem["key"];1
9var name = localStorage.getItem["key"];18
head
3 Thuộc tính chỉ đọc localStorage
của giao diện window
cho phép bạn truy cập đối tượng Storage
cho nguồn gốc của Document
;
localStorage
tương tự như sessionStorage
, ngoại trừ trong khi dữ liệu localStorage
không có thời gian hết hạn, thì dữ liệu sessionStorage
sẽ bị xóa khi phiên trang kết thúc — tức là khi đóng trang. [localStorage
dữ liệu cho tài liệu được tải trong phiên "duyệt web riêng tư" hoặc "ẩn danh" bị xóa khi đóng tab "riêng tư" cuối cùng. ]
Một đối tượng Storage
có thể được sử dụng để truy cập không gian lưu trữ cục bộ của nguồn gốc hiện tại
const cat = localStorage.getItem['myCat'];
4Thuộc một trong các trường hợp sau
- Nguồn gốc không phải là. Điều này có thể xảy ra nếu nguồn gốc sử dụng lược đồ
5 hoặcconst cat = localStorage.getItem['myCat'];
6 chẳng hạnconst cat = localStorage.getItem['myCat'];
- Yêu cầu vi phạm một quyết định về chính sách. Ví dụ: người dùng đã định cấu hình trình duyệt để ngăn trang lưu trữ dữ liệu
Lưu ý rằng nếu người dùng chặn cookie, trình duyệt có thể sẽ hiểu đây là hướng dẫn để ngăn trang lưu trữ dữ liệu
Các khóa và giá trị được lưu trữ với localStorage
luôn ở định dạng chuỗi UTF-16, sử dụng hai byte cho mỗi ký tự. Đối với các đối tượng, các khóa số nguyên được tự động chuyển đổi thành chuỗi
Dữ liệu localStorage
dành riêng cho giao thức của tài liệu. Đặc biệt, đối với một trang web được tải qua HTTP [e. g. ,
const cat = localStorage.getItem['myCat'];
9], localStorage
trả về một đối tượng khác với localStorage
cho trang web tương ứng được tải qua HTTPS [e. g. , localStorage.removeItem['myCat'];
2]Đối với các tài liệu được tải từ
const cat = localStorage.getItem['myCat'];
5 URL [nghĩa là các tệp được mở trong trình duyệt trực tiếp từ hệ thống tệp cục bộ của người dùng, thay vì được cung cấp từ máy chủ web], các yêu cầu đối với hành vi localStorage
không được xác định và có thể khác nhau giữa các trình duyệt khác nhauTrong tất cả các trình duyệt hiện tại, localStorage
dường như trả về một đối tượng khác cho mỗi URL
const cat = localStorage.getItem['myCat'];
5. Nói cách khác, mỗi URL const cat = localStorage.getItem['myCat'];
5 dường như có khu vực lưu trữ cục bộ duy nhất của riêng nó. Nhưng không có gì đảm bảo về hành vi đó, vì vậy bạn không nên dựa vào nó vì như đã đề cập ở trên, các yêu cầu đối với URL const cat = localStorage.getItem['myCat'];
5 vẫn chưa được xác định. Vì vậy, có khả năng các trình duyệt có thể thay đổi cách xử lý URL const cat = localStorage.getItem['myCat'];
5 của họ cho localStorage
bất cứ lúc nào. Trên thực tế, một số trình duyệt đã thay đổi cách xử lý đối với nó theo thời gianĐoạn mã sau truy cập đối tượng địa phương Storage
của tên miền hiện tại và thêm một mục dữ liệu vào nó bằng cách sử dụng
localStorage.clear[];
2