这里有新鲜出炉的 Javascript 教程,程序狗速度看过来!
Javascript 是一种由 Netscape 的 LiveScript 发展而来的原型化继承的基于对象的动态类型的区分大小写的客户端脚本语言,主要目的是为了解决服务器端语言,比如 Perl,遗留的速度问题,为客户提供更流畅的浏览效果。
这篇文章主要介绍了使用 javascript 实现 json 数据以 csv 格式下载, 需要的朋友可以参考下
摘要: 最近有一个非项目的小需求,就是将项目开发分工文件化,方便后期管理维护。但是开发时,分工安排都是以 json 格式记录的,所以就做了一个将 json 数据以 csv 格式下载到本地。
代码:
- download csv http: //code.jquery.com/jquery-1.11.0.min.js"></script>
- Enter JSON data [{
- "Vehicle": "BMW",
- "Date": "30 Jul 2013 09:24 AM",
- "Location": "Hauz Khas",
- "Speed": 42
- },
- {
- "Vehicle": "Honda CBR",
- "Date": "30 Jul 2013 12:00 AM",
- "Location": "Military Road",
- "Speed": 0
- },
- {
- "Vehicle": "Supra",
- "Date": "30 Jul 2013 07:53 AM",
- "Location": "Sec-45",
- "Speed": 58
- },
- {
- "Vehicle": "Land Cruiser",
- "Date": "30 Jul 2013 09:35 AM",
- "Location": "DLF Phase I",
- "Speed": 83
- }] < /code></pre > <span class = "modify" > < /span><span class="modify">
- </span > <span class = "modify" > < /span>Download CSV<span class="modify">
- </span > <span class = "modify" > < /span></span > </code></pre > <p > download.js < /p>
- <pre><code>
- $(document).ready(function() {
- "use strict";
- var mo = {
- init: function() {
- $('.download').click(function() {
- var data = $('#txt').val();
- if (data === '') {
- return;
- }
- mo.JSONToCSVConvertor(data, true);
- });
- },
- JSONToCSVConvertor: function(JSONData, ShowLabel) {
- var arrData = typeof JSONData !== 'object' ? JSON.parse(JSONData) : JSONData;
- var CSV = '';
- if (ShowLabel) {
- var row = "";
- for (var index in arrData[0]) {
- row += index + ',';
- }
- row = row.slice(0, -1);
- CSV += row + '\r\n';
- }
- for (var i = 0; i < arrData.length; i++) {
- var row = "";
- for (var index in arrData[i]) {
- var arrValue = arrData[i][index] == null ? "" : '="' + arrData[i][index] + '"';
- row += arrValue + ',';
- }
- row.slice(0, row.length - 1);
- CSV += row + '\r\n';
- }
- if (CSV == '') {
- growl.error("Invalid data");
- return;
- }
- var fileName = "Result";
- if (mo.msieversion()) {
- var IEwindow = window.open();
- IEwindow.document.write('sep=,\r\n' + CSV);
- IEwindow.document.close();
- IEwindow.document.execCommand('SaveAs', true, fileName + ".csv");
- IEwindow.close();
- } else {
- var uri = 'data:application/csv;
- charset = utf - 8,
- ' + escape(CSV);
- var link = document.createElement("a");
- link.href = uri;
- link.style = "visibility:hidden";
- link.download = fileName + ".csv";
- document.body.appendChild(link);
- link.click();
- document.body.removeChild(link);
- }
- },
- msieversion: function() {
- var ua = window.navigator.userAgent;
- var msie = ua.indexOf("MSIE ");
- if (msie > 0 || !!navigator.userAgent.match(/Trident.*rv\:11\./)) // If Internet Explorer, return version number
- {
- return true;
- } else { // If another browser,
- return false;
- }
- return false;
- },
- main: function() {
- mo.init();
- }
- };
- mo.main();
- });
- </code></pre>
- <p><span class="modify">小结:</span><span class="modify">
- 注意json格式[{},{}],文件名是在js中定义的变量fileName。主要问题是他会自动添加一行空行,且每个元素都会在值前面加个' = '。</span></p>
- <p>下载下来的数据格式为:</p>
- <p><img class="img-responsive" src="http://www.h3399.cn/uploads/body/208/548525507240.png" src="http://www.h3399.cn/uploads/body/208/548525507240.png"></p>
- <p>
- <ins class="adsbygoogle"></ins>
- </p>'
来源: http://www.phperz.com/article/17/0416/273428.html