HTML hiển thị dữ liệu localStorage như thế nào?

Question

Cửa sổ DOM HTML Thuộc tính localStorage

Nội dung chính Show

Làm cách nào để hiển thị giá trị lưu trữ cục bộ trong HTML?
Làm cách nào để hiển thị dữ liệu lưu trữ cục bộ trong bảng HTML bằng JavaScript?
LocalStorage trong HTML là gì?

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

Bàn luận

khóa học

Luyện tập

Băng hình

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

<html>

<head>

var name = localStorage.getItem("key");

1<___

var name = localStorage.getItem("key");

3

var name = localStorage.getItem("key");

4

var name = localStorage.getItem("key");

3>

var name = localStorage.getItem("key");

1<

var name = localStorage.getItem("key");

9>

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");

11

2

var name = localStorage.getItem("key");

1____52_______4

var name = localStorage.getItem("key");

1____52_______6

localStorage.removeItem("key");

68

localStorage.removeItem("key");

6<0

<1____53_______2

localStorage.removeItem("key");

61

var name = localStorage.getItem("key");

11

2

var name = localStorage.getItem("key");

1____53_______9

var name = localStorage.getItem("key");

1html1

localStorage.removeItem("key");

6html3

localStorage.removeItem("key");

6html5

var name = localStorage.getItem("key");

11

var name = localStorage.getItem("key");

1html9

var name = localStorage.getItem("key");

9>

html9head>

<55_______7 >8>9 0>

var name = localStorage.getItem("key");

1_______53_______ 4>

localStorage.removeItem("key");

6 7

localStorage.removeItem("key");

6 9

localStorage.removeItem("key");

1html9 4>

var name = localStorage.getItem("key");

1<<6 <7>9head9

var name = localStorage.getItem("key");

00>9

var name = localStorage.getItem("key");

15

var name = localStorage.getItem("key");

03>9

var name = localStorage.getItem("key");

18 head3

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');

4

Thuộ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 đồ
```
const cat = localStorage.getItem('myCat');
```
5 hoặc
```
const cat = localStorage.getItem('myCat');
```
6 chẳng hạn
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 nhau

Trong 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

Làm cách nào để hiển thị giá trị lưu trữ cục bộ trong HTML?

Phương thức getItem() lưu trữ .

Nhận giá trị của mục lưu trữ cục bộ được chỉ định. var x = localStorage. .

Ví dụ tương tự, nhưng sử dụng lưu trữ phiên thay vì lưu trữ cục bộ. Nhận giá trị của mục lưu trữ phiên được chỉ định. .

Bạn cũng có thể lấy giá trị bằng cách sử dụng ký hiệu dấu chấm (obj. chìa khóa). .

Bạn cũng có thể nhận được giá trị như thế này

Làm cách nào để hiển thị dữ liệu lưu trữ cục bộ trong bảng HTML bằng JavaScript?

In this project add a new HTML page, name it as 'H5_LocalStorage. html'. Add a new folder in the project, name it as 'MyScripts'. In the above markup, the

with id as 'dvcontainer' will be used to generate a Table dynamically to display data from the LocalStorage.

LocalStorage trong HTML là gì?

Bộ nhớ cục bộ chủ yếu được sử dụng để lưu trữ và truy xuất dữ liệu trong các trang HTML từ cùng một miền. Ngay cả sau khi khởi động lại trình duyệt, dữ liệu có thể được khôi phục từ tất cả các cửa sổ trong cùng một miền. Loại lưu trữ này cung cấp nhiều tùy chọn cho các ứng dụng Web

programming html

HTML hiển thị dữ liệu localStorage như thế nào?

HTML

Làm cách nào để hiển thị giá trị lưu trữ cục bộ trong HTML?

Làm cách nào để hiển thị dữ liệu lưu trữ cục bộ trong bảng HTML bằng JavaScript?

LocalStorage trong HTML là gì?

Bài Viết Liên Quan

Quảng Cáo

Có thể bạn quan tâm

Toplist được quan tâm

Quảng cáo

Xem Nhiều

Quảng cáo

Chúng tôi

Điều khoản

Trợ giúp

Mạng xã hội