前端html拿到后台数据

Window浏览器中有一个localStorage 属性，大意是创建一个本地存储的 key/value 对，但对于前后端数据互传比较便利，相当于一个大小5M的前端页面数据库。

// 存储
localStorage.setItem("key", "value");
// 检索
document.getElementById("id").innerHTML = localStorage.getItem("key");

// 打印
var result = localStorage.getItem("key");
console.log(result);
----------得到结果 value

// 删除
localStorage.removeItem("key");

---

localStorage 的局限

•  1、 IE8 以上的 IE 版本才支持 localStorage 这个属性。
•  2、localStorage的值类型限定为String类型。
•  3、localStorage在浏览器的隐私模式下面是不可读取的。
•  4、localStorage本质上是对字符串的读取，存储内容会导致页面变卡。
•  5、localStorage不能被爬虫抓取到。
• 6、localStorage基本是只有5M的空间。

具体细节请看：Window localStorage 属性 | 菜鸟教程

页面按F12进入开发模式可以看到localStorage，如下图。

同时推荐了解一下sessionStorage，有异曲同工之妙：Window sessionStorage 属性 | 菜鸟教程