精华内容
下载资源
问答
  • js导出
    2022-08-05 15:36:07

    https://www.jianshu.com/p/d93c2c82e4ff
    使用到的库
    docxtemplater 邮件合并工具,以编程方式使用并处理条件,循环,且可以扩展以插入任何内容(表格,html,图像)
    jszip-utils 使用ajax调用提供文件的服务器上获取文件(HTTP GET)如果浏览器支持跨域请求,则将起作用
    JSZip 创建,读取,编辑.zip文件的JavaScript库
    FileSaver 客户端保存文件的解决方案,适合在客户端生成文件的web应用程序saveAs() 可利用新流的强大功能将数据异步直接保存到硬盘驱动器应用程序接口,支持进度,取消和知道何时完成协作

    安装

    npm install docxtemplater pizzip --save
    npm install jszip-utils --save
    npm install jszip --save
    npm install file-saver --save
    

    引入

    import docxtemplater from 'docxtemplater'
    import PizZip from 'pizzip'
    import JSZipUtils from 'jszip-utils'
    import {saveAs} from 'file-saver'
    
    exportWord() {
       const _this = this;
       JSZipUtils.getBinaryContent(`/${System.SYSTEM_PATH}/test.docx`, function (error, content) {
         // 抛出异常
         if (error) {
           throw error;
         }
         // 创建一个JSZip实例,内容为模板的内容
         let zip = new JSZip(content);
         // 创建并加载docxtemplater实例对象
         let doc = new Docxtemplater().loadZip(zip);
         // 设置模板变量的值
         doc.setData({
           ..._this.baseInfo,
           ..._this.types,
           ..._this.treeInfo,
           question: _this.question,
         });
         try {
           // 用模板变量的值替换所有模板变量
           doc.render();
         } catch (error) {
           this.$message.error('导出报表失败');
           throw error;
         }
    
         // 生成一个代表docxtemplater对象的zip文件(不是一个真实的文件,而是在内存中的表示)
         let out = doc.getZip().generate({
           type: 'blob',
           mimeType: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
         });
         // 将目标文件对象保存为目标类型的文件,并命名
         saveAs(out, 'RA报告.docx');
       });
     },
    
    更多相关内容
  • HTML用JS导出Excel的五种方法.javascript导出excel的5种方法
  • JavaScript根据json数据或table表格导出CSV文件 <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-...

    JavaScript根据json数据或table表格导出CSV文件

    <!DOCTYPE html>
    <html lang="zh">
    	<head>
    		<meta charset="UTF-8">
    		<meta name="viewport" content="width=device-width, initial-scale=1.0">
    		<meta http-equiv="X-UA-Compatible" content="ie=edge">
    		<title>JavaScript导出CSV文件</title>
    		<link rel="stylesheet" type="text/css" href="bootstrap-3.4.1-dist/css/bootstrap.css" />
    	</head>
    	<style type="text/css">
    
    	</style>
    	<body>
    		<div class="col-lg-12">
    			<button type="button" class="btn btn-primary" id="btn1">从表格导出CSV</button>
    			<button type="button" class="btn btn-primary" id="btn2">根据json数据导出CSV</button>
    			<table class="table table-bordered" id="tableId">
    				<thead>
    					<tr>
    						<th>序号</th>
    						<th>姓名</th>
    						<th>电话</th>
    						<th>资产/亿元</th>
    					</tr>
    				</thead>
    				<tbody id="tbody">
    					<tr>
    						<td>1</td>
    						<td>马云</td>
    						<td>10086</td>
    						<td>3874</td>
    					</tr>
    					<tr>
    						<td>2</td>
    						<td>马化腾</td>
    						<td>10086</td>
    						<td>3527</td>
    					</tr>
    					<tr>
    						<td>3</td>
    						<td>许家印</td>
    						<td>10086</td>
    						<td>2759</td>
    					</tr>
    				</tbody>
    			</table>
    		</div>
    	</body>
    	<script src="js/jquery-3.4.1.min.js"></script>
    	<script type="text/javascript">
    		// 从table导出CSV
    		function byTableDownLoadCsv(tableId, csvFileName) {
    			let js_csv = {
    				export_csv: function(data, name) {
    					// “\ufeff” BOM头
    					var uri = 'data:text/csv;charset=utf-8,\ufeff' + encodeURIComponent(data);
    					var downloadLink = document.createElement("a");
    					downloadLink.href = uri;
    					downloadLink.download = (name + ".csv") || "temp.csv";
    					document.body.appendChild(downloadLink);
    					downloadLink.click();
    					document.body.removeChild(downloadLink);
    				},
    				export_table: function(selector, name) {
    					var self = this;
    					if (document.querySelectorAll(selector).length == 0) {
    						alert('Selector "' + selector + '" not exists!');
    						return false;
    					}
    					self.export_csv(self.get_table_data(selector), name);
    				},
    				get_table_data: function(selector) {
    					var data = "";
    					document.querySelectorAll(selector + ' tr').forEach(function(t) {
    						var tmp = [];
    						t.querySelectorAll('th,td').forEach(function(e) {
    							tmp.push(e.innerText.replace("\n", "")); // 单元格里含有多个html元素可能会获取到换行符
    						});
    						data += tmp.join(",") + "\n";
    					});
    					return data;
    				}
    			};
    			js_csv.export_table(tableId, csvFileName);
    		};
    		let jsonData = new Array(10).fill({
    			name: '小明',
    			tel: 10086,
    			money: 1000
    		});
    		let str = ""
    		for (let i = 0; i < jsonData.length; i++) {
    			str += `<tr><td>${i+1}</td>`
    			let item = jsonData[i];
    			for (key in item) {
    				str += `<td>${item[key]}</td>`
    			}
    		}
    		document.querySelector("#tbody").innerHTML = str
    		//根据json数据导出CSV
    		function byJsonDownLoadCsv(data, csvTrName, fileName) {
    			let jsonData = data;
    			//列标题,逗号隔开,每一个逗号就是隔开一个单元格
    			let str = csvTrName;
    			//增加\t为了不让表格显示科学计数法或者其他格式
    			for (let i = 0; i < jsonData.length; i++) {
    				for (let item in jsonData[i]) {
    					str += `${jsonData[i][item] + '\t'},`;
    				}
    				str += '\n';
    			}
    			//encodeURIComponent解决中文乱码
    			let uri = 'data:text/csv;charset=utf-8,\ufeff' + encodeURIComponent(str);
    			//通过创建a标签实现
    			let link = document.createElement("a");
    			link.href = uri;
    			//对下载的文件命名
    			link.download = `${fileName}.csv`;
    			document.body.appendChild(link);
    			link.click();
    			document.body.removeChild(link);
    		};
    		//方法一:从表格导出的文件
    		//byTableDownLoadCsv('#tableId', '从表格导出的文件');
    		//byTableDownLoadCsv方法接收两个参数byTableDownLoadCsv(data1,data2)
    		//data1:table表格的id,需要加#号
    		//data2:导出的CSV的文件名称,不需要加文件后缀名.csv 
    		//使用时直接调用byTableDownLoadCsv此函数即可
    		//byTableDownLoadCsv('#tableId', '从表格导出的文件');
    		document.querySelector("#btn1").onclick = function() {
    			byTableDownLoadCsv('#tableId', '从表格导出的文件');
    		}
    
    
    		//方法二:根据json数据导出的文件
    		//byJsonDownLoadCsv(jsonData, `姓名,电话,资产(亿元)\n`, '根据json数据导出的文件');
    		//byJsonDownLoadCsv方法接收三个参数byJsonDownLoadCsv(data1,data2,data3)
    		//data1:需要导出的CSV json数据 例:[{},{},{},{}]
    		//data2:导出的CSV的第一行字段名称,例如:机种、制程、良率......,必须以 `机种,制程,良率\n` 此种格式传参
    		//data3:导出的CSV的文件名称,不需要加文件后缀名.csv 
    		//使用时直接调用byJsonDownLoadCsv此函数即可
    		//byJsonDownLoadCsv(jsonData, `姓名,电话,资产(亿元)\n`, '根据json数据导出的文件');
    		document.querySelector("#btn2").onclick = function() {
    			byJsonDownLoadCsv(jsonData, `姓名,电话,资产(亿元)\n`, '根据json数据导出的文件');
    		}
    	</script>
    </html>
    
    
    展开全文
  • js导出excel.zip

    2020-04-22 18:24:22
    包含easyui,datagrid的列表导出,支持多表头,数据值格式化。QUICKUI,QUIGRID导出导出excel格式为:xls。
  • 1.1 方法和变量导出(写在被导出方法和变量的js文件)   module.exports = { variable: value, method : methodName } 1.2 class导出(es6语法) class HomeModule { constructor(url) { this.url = url; } } export ...
  • 使用js导出带样式的excel表格模板,有demo
  • js 导出 Excel 【支持大量数据导出,亲测】、支持IE噢
  • ThreeJS导出三维模型、导入三维模型、导入三维动画
  • js导出excel为xlsx格式

    2018-05-27 17:31:55
    Javascript导出excel为xlsx格式,兼容IE6+和主流浏览器,下载下来直接可以使用。 其他javascript导出excel插件可看作者文章:https://blog.csdn.net/qq_21693027/article/details/80459677
  • 使用xlsx.full.min.js导出有复杂表头的excel(亲测有效) > 今天项目用到了导出table表格,但表头有点特殊,多个合并的单元格。 > 搜索了半天,发现有博主使用 ``xlsx.full.min.js`` 做过此类功能,使用的是vue+...
  • JavaScript实现json格式数据导出到Excel文件,支持多个Sheet页导出
  • 前端导出数据为excel(兼容chrome 和 IE10以上版本),列举了网上常用的两种方法外,新增了可以导出超过5W行数据的方法
  • js 导出excel(.xls格式)

    2020-10-21 15:08:09
    为了减轻服务器的压力,很多网站采用的js下载或导出数据的方式。 该文件就是利用javascript把json数据转换成excel数据后,并进行了下载。 真实可用,而且使用起来方便快捷,为了开发快速,可以下载看看。 里面有教程...
  • 最常见的方式是使用js函数操作excle文件,这种方式可能因浏览器不同,存在兼容性问题。另一种简单方法就是导出一个excel能识别格式的xml文件,用excel打开。
  • 主要给大家介绍了关于javascript导出csv文件(excel)的相关资料,文中通过示例代码介绍的非常详细,对大家学习或者使用javascript具有一定的参考学习价值,需要的朋友们下面来一起学习学习吧
  • js导出Word实现默认页面视图、默认横向显示、默认分栏。......................
  • js导出Word默认页面视图、横向显示、分栏、设置固定页眉
  • JS导出页面数据到excel

    2018-10-10 10:38:18
    这是一个JS工具类程序,可以将页面数据导出到excel表格,不使用后台代码。纯前端代码实现。简单实用
  • 做法: 修改Input的outerHTML; 具体例子: 代码如下: function resetInput() { var controls = document.getElementsByTagName(‘input’); for(var i=0; i<controls.length; i++){ if(controls[i].type==’text...
  • bootstraptable 可以直接导出的插件,导出内容自动居中处理 https://blog.csdn.net/qq_39087348/article/details/112970600
  • 当vue.js需要导出Excel文件时,需要的Blob.js和Export2Excel.js
  • js导出excel插件,插件中自带导出例子,插件解决导出excel打开时候报错“扩展名不一致问题”。
  • 1.通过xlsx.core.min.js库,导出自定义Exsl表格. 2.可以自定义表格的宽度与高度
  • js导出html数据存入excel中,存在兼容问题支持部分浏览器
  • js 导出json文件

    千次阅读 2021-05-23 10:57:30
    function saveJSON(data, filename){ if(!data) { alert('保存的数据为空'); return; } if(!filename) filename = 'json.json' if(typeof data === 'object'){ data = JSON.stringify(data, undefined,...
    function saveJSON(data, filename){
    	if(!data) {
    		alert('保存的数据为空');
    		return;
    	}
    	if(!filename) 
    		filename = 'json.json'
    	if(typeof data === 'object'){
    		data = JSON.stringify(data, undefined, 4)
    	}
    	var blob = new Blob([data], {type: 'text/json'}),
    	e = document.createEvent('MouseEvents'),
    	a = document.createElement('a')
    	a.download = filename
    	a.href = window.URL.createObjectURL(blob)
    	a.dataset.downloadurl = ['text/json', a.download, a.href].join(':')
    	e.initMouseEvent('click', true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null)
    	a.dispatchEvent(e)
    }
    
    展开全文
  • js导出excel文件,支持chrome、ie、firefox等主流浏览器 js导出excel文件,支持chrome、ie、firefox等主流浏览器
  • Javascript导出excel为xlsx格式,兼容IE6+和主流浏览器,下载下来直接可以使用。 其他javascript导出excel插件可看作者文章:https://blog.csdn.net/qq_21693027/article/details/80459677
  • js导出excel.rar

    2020-07-30 18:14:55
    压缩包解压即用,放入你要导入的table 注意引用压缩包中的JS 不需要任何后台代码 本人第一次上传资源 有需要优化的或者其他意见欢迎大家指出
  • JS导出导入Excel文件插件, 简单好用,含有Demo,运行就懂!
  • 在做前端开发时,常常会用到通过js把数据导入到excel的功能,现在给出给简单demo代码,以供以后使用

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 178,973
精华内容 71,589
关键字:

js导出