一, 存储数据
html 中
<div id="test"></div>
JS 中
- localStorage.setItem("key",2);
- let a = document.createElement("p");
- let test = document.getElementById("test");
- test.appendChild(a);
- a.innerHTML = localStorage.getItem("key");
最终效果 (上面是网页中显示的, 下面是 localstorage 中存储的)
二, 存储对象
html 中
<div id="test">
</div>
JS 中
- let value = [1, 2, 3];
- function save(name, value) {
- if (typeof value == "object") {
- localStorage[name] = JSON.stringify(value);
- } else {
- localStorage[name] = value;
- }
- }
- function get(name, defaultValue) {
- let value;
- if (!localStorage[name]) {
- value = defaultValue;
- } else {
- value = JSON.parse(localStorage[name]);
- }
- return value;
- }
- save("s", value);// 存储数据
- let a = document.createElement("p");// 创建一个 p 元素
- let test = document.getElementById("test");// 获取到 div 元素
- test.appendChild(a);// 将 p 添加到 div 元素中
- a.innerHTML = get("s");//p 的元素内容解析为本地存储的值
最终结果 (上面是网页中显示的, 下面是 localstorage 中存储的)
来源: http://www.bubuko.com/infodetail-2652796.html