最近刚刚写了个json数据导出生成Excel文件的,顺便总结下利用FileSaver.js导出其他文件的,这里要注意的一个点就是,当导出的是json文件或是txt文件时,导出的内容要是字符串,特别当时导出的数据是json数据时,要记得转一把。好了,不多说,直接上一个小小的demo,如下:

下载地址:

https://github.com/eligrey/FileSaver.js

 <!DOCTYPE html>
<html> <head>
<meta charset="UTF-8">
<title>导出生成json文件和文本</title>
<script src="js/FileSaver.min.js"></script>
</head> <body>
<button onclick="downloadJson(students)">导出生成json文件</button>
<button onclick="downloadText(students)">导出生成文本</button>
</body>
<script>
var students = [{
"name": "小明1",
"age": "6",
"sex": "男",
"height": "60"
}, {
"name": "小明2",
"age": "7",
"sex": "男",
"height": "70"
}, {
"name": "小明3",
"age": "8",
"sex": "男",
"height": "80"
}];
// 导出生成json文件
function downloadJson(data) {
var blob = new Blob([JSON.stringify(data)], { type: "" });
saveAs(blob, "hello.json");
}
// 导出生成文本
function downloadText(data) {
var blob = new Blob([JSON.stringify(data)], { type: "text/plain;charset=utf-8" });
saveAs(blob, "hello.txt");
} </script> </html>

FileSaver.js导出json文件和文本的更多相关文章

  1. FileSaver.js 实现浏览器文件导出

    FileSaver.js 实现浏览器文件导出 在浏览器中用 FileSaver.js 可以下载文件,不会造成文件直接打开等情况

  2. EasyUI 如何结合JS导出Excel文件

    出处:http://blog.csdn.net/jumtre/article/details/41119991 EasyUI 如何结合JS导出Excel文件 分类: 技术 Javascript jQu ...

  3. js vs2013中允许js访问json文件的解决方案

    js  vs2013中允许js访问json文件的解决方案 <?xml version="1.0" encoding="utf-8"?> <!- ...

  4. Web 端 js 导出csv文件(使用a标签)

    前言 导出文件,使用最多的方式还是服务器端来处理.比如jsp 中使用response 的方式. 但是,有时候可能就想使用web 前端是否也可以把页面上的内容导出来呢? 比如说,导出页面的一个表格. 这 ...

  5. 【转载】JS导出CSV文件

    转自:http://www.cnblogs.com/dengnan/p/3990211.html 通过自己实际测试有以下几种方法 方法一通过a标签实现,把要导出的数据用“\n”和“,”拼接成一个字符串 ...

  6. JAVA生成并导出json文件

    将一个list集合转换成json文件并导出: 数据集合: List<Object> agencyList = new ArrayList<Object>(); Map<S ...

  7. JS读取json 文件

    json文件是一种轻量级的数据交互格式.一般在jquery中使用getJSON()方法读取. $.getJSON(url,[data],[callback]) url:加载的页面地址 data: 可选 ...

  8. 使用Scrapy命令行工具【导出JSON文件】时编码设置

    Windows 10家庭中文版,Python 3.6.4,virtualenv 16.0.0,Scrapy 1.5.0, 使用scrapy命令行工具建立了爬虫项目(startproject),并使用s ...

  9. elasticsearch将数据导出json文件【使用elasticdump】

    1.前提准备 需要使用npm安装,还未安装的朋友可以阅读另一篇我的博客<安装使用npm>,windows环境. 2.安装es-dump 打开终端窗口PowerShell或者cmd. 输入命 ...

随机推荐

  1. [转]深入详解javascript之delete操作符

    最近重新温习JS,对delete操作符一直处于一知半解的状态,偶然发现一篇文章,对此作了非常细致深入的解释,看完有茅塞顿开的感觉,不敢独享,大致翻译如下. 原文地址:http://perfection ...

  2. bzoj 4403 序列统计——转化成组合数的思路

    题目:https://www.lydsy.com/JudgeOnline/problem.php?id=4403 先说说自己的想法吧. 设f[ i ][ j ]表示当前在倒数第 i 个位置,当前和后面 ...

  3. bzoj 2839 集合计数 —— 二项式反演

    题目:https://www.lydsy.com/JudgeOnline/problem.php?id=2839 设 \( f(i) \) 为至少 \( i \) 个选择,则 \( f(i) = C_ ...

  4. 安装部署ELK系统监控Azure China的NSG和WAF Log

    ELK是一个开源的产品,其官网是:https://www.elastic.co/ ELK主要保护三个产品: Elasticsearch:是基于 JSON 的分布式搜索和分析引擎,专为实现水平扩展.高可 ...

  5. Cache缓存优化

    降低数据库压力 <appSettings><add key="/></appSettings> //设置实体缓存时间 public RupengWang. ...

  6. JavaWeb开发Eclipse环境配置--史上最详细的教程

    [前言] JSP本身是JavaWeb中的知识,但是在学习Android网络时,必然要涉及到与服务器之间的交互,所以学一下JSP以及其他JavaWeb的内容还是很有必要的,至少能明白程序在访问服务器时, ...

  7. Java-API:java.util.map

    ylbtech-Java-API:java.util.map compact1, compact2, compact3 java.util Interface Map<K,V> Type ...

  8. BA 新web化 问题汇总

    1. 3D堆栈图在winform端无法显示,但在web端可以正常显示,说明与浏览器版本有关,在 IE 中设置文档模式为 IE8 即报错,IE9 却正常显示,可在 <head>节点下添加如下 ...

  9. AndroidStudio 中使用FFMPEG

    1.下载 FFmpeg 源码 git clone https://git.ffmpeg.org/ffmpeg.git 这一步可能会花比较长的时间 2.编译 FFmpeg for Android 2.1 ...

  10. Web Api2 中线程的使用

    System.Threading.Thread th = new System.Threading.Thread(方法名); th.IsBackground = true; th.Start(); 上 ...