文档章节

【JavaScript】自制的Excel变Json工具

yongh701
 yongh701
发布于 2018/09/01 10:36
字数 545
阅读 58
收藏 1

有时候我们需要将Excel的内容变成Json,虽然这些工具在如同在《【jQuery】jQuery对本地json的读取和遍历》(https://my.oschina.net/u/3776619/blog/1813174)所提到的,网上一搜一大把,但是这完全可以自己用Javascript自己写。

其实这也是涉及一个,如何用Javascript将一个二维表搞成Json的问题了。

以下是我自制的一个Excel变Json工具:

既然是自用的工具就无须这么高端,更何况Javascript也无法对文件进行操作。只须满足将Excel的内容copy过来,放到一个textarea里面,点击“转换”按钮,就会出现Json即可。

要完成这个转换,首先明白Excel复制过来的内容是,单元格与单元格之间是用\t隔开的,而行与行之间是用\r\n隔开的。如下图所示。

首先javascript是有split函数的,这就好办了,分别以split("\r\n")分开行,再用split("\t")分开每一单元格。

之后关键是我们需要拼出一个Json字符串。

二维表变Json就是将每一行的内容放到一个Json,也就是{'key1':''value1','key2':''value2'}之内,而所有的行将组成一个json数组[{},{},{}]。

所以上来和收尾先来个[和],然后就是两个for的事情,上述效果的代码如下:

<html>
	<body>
		<textarea id="excel" rows="10" cols="80"></textarea><br>
		<button onclick="convert()">转换</button><br>
		<p id="json">
		</p>
		<script>
			function convert(){
				var excel=document.getElementById("excel").innerHTML;
				var row=excel.split("\r\n");
				var header_row=row[0].split("\t");
				var json_str="[";
				
				for(var i=1;i<row.length;i++){
					json_str+="{";
					var cell=row[i].split("\t");
					for(var j=0;j<cell.length;j++){
						json_str+="'"+header_row[j]+"':'"+cell[j]+"'";
						if(j!=cell.length-1){
							json_str+=","
						}
					}
					json_str+="}";
					if(i!=row.length-1){
						json_str+=","
					}
				}				
				json_str+="]";				
				document.getElementById("json").innerHTML=json_str;
			}
		</script>
	</body>
</html>

由于这里,json的收尾的是不能有,存在的,所以在循环中,我们要判断是不是最后一个,若不是,才加,。

© 著作权归作者所有

yongh701
粉丝 27
博文 17
码字总数 10682
作品 0
佛山
私信 提问
【jQuery】jQuery对本地json的读取和遍历

有时候,我们想写写一个跨平台的单机小程序、小软件,自然就会想到HTML5,但我们又不想运用服务器或者数据库这么重型的东西,自然就会想到用json或者xml来存些持久化数据,让我们的小程序加载...

yongh701
2018/05/15
752
0
使用JavaScript将Excel转换为JSON

JSON是码农们常用的数据格式,轻且方便,而直接手敲JSON却是比较麻烦和令人心情崩溃的(因为重复的东西很多),所以很多码农可能会和我一样,选择用Excel去输入数据,然后再想办法转换成JSO...

alentan
06/13
0
0
10种值得推荐的数据可视化工具

D3.js 基于JavaScript的数据可视化库,允许绑定任意数据到DOM,然后将数据驱动转换应用到Document中。 2. Data.js Data.js是一个JavaScript数据表示框架,提供统一的接口和数据域,是一款简单...

李朝强
2014/01/09
191
0
前端进阶(十五)前端上传Excel文件,后端成功返回Json格式失败返回Excel

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。 https://blog.csdn.net/u014744118/article/details/90410046 html文件 注意: (1)本次采用...

CoolSummmer
05/21
0
0
用JavaScript把CSV与Excel转为Json

作者:Yann Mulonda 翻译:疯狂的技术宅 原文:blog.bitsrc.io/csv-excel-t… 未经允许严禁转载 有两个 JavaScript 插件可用于读取和处理 CSV 和 Excel 文件,之后仅对自己的脚本进行编码即可...

前端先锋
09/27
0
0

没有更多内容

加载失败,请刷新页面

加载更多

springboot 403 问题

添加WebAppConfigurer 配置 @Configuration@EnableAutoConfigurationpublic class WebAppConfigurer extends WebMvcConfigurerAdapter { public WebAppConfigurer() { } ......

布袋和尚_爱吃鱼
17分钟前
3
0
Python自动更换壁纸爬虫与tkinter结合

直接上代码 import ctypesimport timeimport requestsimport osfrom threading import Threadfrom tkinter import Tk, Label, Button,Entry,StringVar,messagebox# '放到AppData\Roami......

物种起源-达尔文
17分钟前
2
0
Postgresql Study 笔记

Postgresql 安装 Windows, MAC Install Postgresql 下载地址: https://www.enterprisedb.com/downloads/postgres-postgresql-downloads Linux Install sudo apt-get update sudo apt-get in......

slagga
19分钟前
3
0
layer.open 打开新页面传参问题

如图所示,点击出售,把A页面的数据传到弹框上面,因为弹框比较复杂,所以使用引入一个新页面。 A.html a.js B.html b.js 1、第一种方案 sellInte: function (){ var obj = document.g...

木九天
22分钟前
3
0
沙龙报名 | 区块链数据服务技术应用实践

京东云是国内首家提供区块链数据在线分析服务产品的公司,也是行业内首家对区块链数据服务进行开源的公司。 本次沙龙是京东云BDS开源后,首次在深圳举办线下沙龙,我们将邀请京东云BDS团队核...

京东云技术新知
23分钟前
3
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部