JS保存数据到本地文件(普通文件和excel文件) |
您所在的位置：网站首页 › 如何将excel中保存到电脑 › JS保存数据到本地文件(普通文件和excel文件) |
JS保存数据到本地文件(普通文件和excel文件)
|
今天做项目，有一个页面是从后台请求数据，如果想下载，那么就手动点击下载数据，可是如果两次都从服务器请求数据，有点浪费服务器资源，所以干脆就直接把数据保存在本地浏览器，然后点击后保存到本地（前面是普通文件，如果想看excel请直接跳到后面）。
那么问题来了：怎么保存？ 先贴代码： function downLoadDataToLoc() { var saveDatas = getDataFromLocal("results"); // 上面是拿到我自己的数据，数据的格式是Json字符串 var blob = new Blob([JSON.stringify(saveDatas)], {type: 'application/json'}) // 创建一个blob的对象，把Json转化为字符串作为我们的值 if("msSaveOrOpenBlob" in navigator){ // 这个判断要不要都行，如果是IE浏览器，使用的是这个， window.navigator.msSaveOrOpenBlob(blob, "results.txt"); } else { // 不是IE浏览器使用的下面的 var url = window.URL.createObjectURL(blob) // 上面这个是创建一个blob的对象连链接， var link = document.createElement('a') // 创建一个链接元素，是属于 a 标签的链接元素，所以括号里才是a， link.href = url; // 把上面获得的blob的对象链接赋值给新创建的这个 a 链接 link.setAttribute('download', "results.txt") // 设置下载的属性（所以使用的是download），这个是a 标签的一个属性 // 后面的是文件名字，可以更改 link.click(); // 使用js点击这个链接 } }代码效果如下图：
希望这篇文章帮助到了大家！！！！ 改不完的需求，需求要求保存为excel格式，想学习怎么保存excel文件格式的同学，请看这里：首先说明我的Json格式（如果Json格式不一样，大家可以根据我的代码自己改，很简单的，我会详细介绍这个代码）： // 下面是我的Json的数据格式，注意，如果格式不同，请修改我的代码 // 可以是一个这样的字符串，但是需要大家手动格式化，使用这个函数 // json = JSON.parse(json); 但是格式化之后一定要和我的格式一样 var json ={ "--普通人--0--朱少强的大号--2019-10-20 09:29:14--Chuckie": ["72447305"], "--普通人--0--朱少强的大号 的第二条--2019-10-20 11:08:37--Chuckie": ["72447305"], "--学生--5--QQ号，新增的--2019-10-22 14:32:57 .09683--Chuckie": ["72447305"], "--好人--5--QQ号，新增的--2019-10-22 14:32:57.09683--Chuckie": ["72447305"], "--周二测试--0--2019年10月22测试--2019-10-22 15:38:46.37403--Chuckie":[ "72447305", "267525217", "123321", "123456", "12345" ], "--普通人--0--朱少强小号--2019-10-20 11:08:55--Chuckie": ["267525217"], }下面是转换的代码（直接复制保存到html中，浏览器打开就能用，亲测可用）： 正则表达式 function JSONToExcelConvertor(fileName, jsonData) { var json = jsonData; var excel = ''; // style中的内容：mso-number-format:General：设置单元格格式为文本，这样可以保证我们的数据一定是原样 for (var name in json) { // 每次循环把每对儿键值的内容放在同一行上 excel += "" + name + ''; for (var i in json[name]){ // 这个i是数据的下标 accountNumber = json[name][i] // 拿到号码 excel += "" + accountNumber + ''; // 每个号码放置到一个单元格， } excel += ""; // 一行结束 } //table结束 excel += ""; var excelFile = ""; excelFile += ''; excelFile += ''; excelFile += ""; excelFile += ""; excelFile += ""; excelFile += ""; excelFile += excel; //将table 拼接 excelFile += ""; excelFile += ""; var uri = 'data:application/vnd.ms-excel;charset=utf-8,' + encodeURIComponent(excelFile); // 给我们上面格式出来的内容设置一个URI(统一资源标志符) var link = document.createElement("a"); //创建a标签 link.href = uri; // 把上文解析出来的链接赋值给上面创建的a标签 link.style = "visibility:hidden"; //设置为不可见，当然设置也可以，看个人喜好 link.download = fileName + ".xls";//指定文件名和文件后缀格式 // 不可以改为 xlsx格式，因为我们这个格式化是按照格式写出来的，而真正的excel文件格式很麻烦 // 如果打不开，查看这个文件属性是否被锁定了，解除锁定即可。 document.body.appendChild(link); //追加a标签到html内部 // 当然不放也能点击，但是为了保险起见，还是放一下 link.click(); // 点击我们刚刚创建的a标签 document.body.removeChild(link); // 把刚刚创建的a标签删除了 } $(function(){ var json ={ "--普通人--0--的大号--2019-10-20 09:29:14--Chuckie": ["72447305"], "--普通人--0--的大号 的第二条--2019-10-20 11:08:37--Chuckie": ["72447305"], "--学生--5--QQ号，新增的--2019-10-22 14:32:57 .09683--Chuckie": ["72447305"], "--好人--5--QQ号，新增的--2019-10-22 14:32:57.09683--Chuckie": ["72447305"], "--周二测试--0--2019年10月22测试--2019-10-22 15:38:46.37403--Chuckie": ["72447305", "267525217", "123321", "123456", "12345" ], "--普通人--0--小号--2019-10-20 11:08:55--Chuckie": ["267525217"] } // 如果大家的是字符串，就把下面两行解除注释，然后取控制台对比数据格式是否一致 // json = JSON.parse(json); // console.log(json) JSONToExcelConvertor("json1",json); })下面这是结果的截图：
|
【本文地址】
今日新闻 |
推荐新闻 |