者：前端小智 来源：大迁世界

.md文件是markdown的一种标记语言，和html比较起来，更简单快捷，主要体现在：标记符的数量和书写上。

• 标记符的数量：html文档需要用到数量繁多的标记符，再辅以css来控制样式和排版，而markdown文档只需要四个基本的标记符号就能完成同样的事。
• 标记符的书写：HTML文档内容需要同时标记开始和结束这是一个网页，而markdown文档则只要在开始位置标记即可# 这是一个md文档。下面介绍如何实现将.md文件转换成.html文件。

方式一：使用i5ting_toc插件

需要先安装npm(安装node.js后会自带npm)，然后才能安装i5ting插件：

npm install i5ting_toc -g

执行命令行生成html文件，在输入前要进入到对应根目录下：

i5ting_toc -f **.md

需要注意的是：写md文档的特殊符号时记得添加空格。小技巧：如何快速在当前目录打开cmd?选择当前目录，按住shift，然后鼠标右键在此处打开命令窗口(在此处打开powerShell窗口)。

方式二：使用gitbook

同样先需要安装node，然后运行：

npm i gitbook gitbook-cli -g

生成md文件,这个命令会生成相应的md的文件，然后在相应的文件里写你的内容即可：

gitbook init

md转html,生成一个_doc目录，打开就可以看到你html文件了。

gitbook build

方式三：利用前端代码

实现原理是采用node.js搭建服务器，读取md文件转化为html片断。浏览器发送ajax请求获取片段后再渲染生成html网页。

node代码：

var express = require('express');

var http = require('http');

var fs = require('fs');

var bodyParser = require('body-parser');

var marked = require('marked'); // 将md转化为html的js包

var app = express();

app.use(express.static('src')); //加载静态文件

var urlencodedParser = bodyParser.urlencoded({ extended: false });

app.get('/getMdFile',urlencodedParser, function(req, res) {

var data = fs.readFileSync('src/test.md', 'utf-8'); //读取本地的md文件

res.end(JSON.stringify({

body : marked(data)

}));

} );

//启动端口监听

var server = app.listen(8088, function () {

var host = server.address().address;

var port = server.address().port;

console.log("应用实例，访问地址为 http://%s:%s", host, port)

});

前端html：

<div id="content"> <h1 class="title">md-to-HTML web app</h1> <div id="article"> </div></div><script type="text/JavaScript" src="js/jquery-1.11.3.min.js"></script><script> var article = document.getElementById('article'); $.ajax({ url: "/getMdFile", success: function(result) { console.log('数据获取成功'); article.innerHTML = JSON.parse(result).body; }, error: function (err) { console.log(err); article.innerHTML = '<p>获取数据失败</p>'; } });</script>

、javascript把二维数组转为json格式的字符串代码如下：

// 二维数组转为json格式的字符串

function arrayToJsonString(o) {
    var len = o.length;
    var new_arr = new Array();
    var str = '',strone='',strs='',jsonstr='';
    for(var i = 0;i<len;i++){
           new_arr = o[i];
            for(var k in new_arr){
               strone += '"'+k+'"'+':'+'"'+new_arr[k]+'"'+',';
               }
           str = '{'+strone.substring(0,strone.length-1)+'}';
           strone='';
           strs += str+',';
           new_arr=[];
        }
    strs = '['+strs.substring(0,strs.length-1)+']';
    return strs;
}

2、改变多维数组中某个元素的值，代码如下：

面是我们如何在 JavaScript 中轻松地将 JSON 转换为 CSV：

function jsonToCsv(items) {
  const header = Object.keys(items[0]);  const headerString = header.join(',');  // handle null or undefined values here
  const replacer = (key, value) => value ?? '';  const rowItems = items.map((row) =>
    header
      .map((fieldName) => JSON.stringify(row[fieldName], replacer))
      .join(',')
  );  // join header and body, and break into separate lines
  const csv = [headerString, ...rowItems].join('\r\n');  return csv;
}const obj = [
  { color: 'red', maxSpeed: 120, age: 2 },
  { color: 'blue', maxSpeed: 100, age: 3 },
  { color: 'green', maxSpeed: 130, age: 2 },
];const csv = jsonToCsv(obj);console.log(csv);

这将是 CSV 输出：

color,maxSpeed,age
"red",120,2
"blue",100,3
"green",130,2

了解步骤

我们创建了一个可重用的 jsonToCsv() 函数来让我们将多个 JSON 字符串转换为 CSV。 它需要一个包含对象的数组。 每个对象将在 CSV 输出中占据一行。

我们在此函数中所做的第一件事是获取将用于 CSV 标头的所有键。 我们希望数组中的所有对象都具有相同的键，因此我们使用 Object.keys() 方法将键从第一个对象项中提取到数组中。

const obj = [
  { color: 'red', maxSpeed: 120, age: 2 },
  { color: 'blue', maxSpeed: 100, age: 3 },
  { color: 'green', maxSpeed: 130, age: 2 },
];// { color: 'red', maxSpeed: 120, age: 2 }
console.log(obj[0]);// [ 'color', 'maxSpeed', 'age' ]
console.log(Object.keys(obj[0]));

获取键后，我们调用数组的 join() 方法将所有元素连接成 CSV 标头字符串。

const header = ['color', 'maxSpeed', 'age'];const headerString = arr.join(',');console.log(headerString); // color,maxSpeed,age

接下来，我们创建一个函数，该函数将作为回调传递给 JSON.stringify() 函数的 replacer 参数。 此函数将处理 JSON 数组中对象的未定义或空属性值。

const obj = { prop1: 'Earth', prop2: undefined };// replace undefined property values with empty string ('')
const replacer = (key, value) => value ?? '';const str = JSON.stringify(obj, replacer);// {"prop1":"Earth","prop2":""}
console.log(str);

然后我们使用 Array map() 方法从每个对象中获取属性值。 map() 接受一个回调函数，该函数在每个数组元素上调用以返回一个转换。

此回调使用标头数组来获取每个对象的所有键。 再次调用 map()，它会遍历每个键，获取对象中该键的对应值，并使用 JSON.stringify() 将其转换为字符串。

这个对 map() 的内部调用最终会产生一个数组，该数组包含数组中当前对象的所有字符串化属性值。

const header = ['color', 'maxSpeed', 'age'];const row = { color: 'red', maxSpeed: 120, age: 2 };const replacer = (key, value) => value ?? '';const rowItem = header.map((fieldName) =>
  JSON.stringify(row[fieldName], replacer)
);// array of stringified property values
console.log(rowItem); // [ '"red"', '120', '2' ]

将对象转换为属性值数组后，使用 join() 将数组转换为 CSV 行。

['"red"', '120', '2'].join(',') // -> "red",120,2

因此，这种转换发生在 JSON 数组中的每个对象上，以生成 CSV 行列表，存储在我们原始示例中的 rowItems 变量中。

为了生成最终的 CSV 输出，我们使用扩展语法 (...) 将 headerString 和 rowItems 组合到一个数组中。

const headerString = ['color', 'maxSpeed', 'age'];const rowItems = ['"red",120,2', '"blue",100,3', '"green",130,2'];[headerString, ...rowItems];
/*
Output ->
[
  [ 'color', 'maxSpeed', 'age' ],
  '"red",120,2',
  '"blue",100,3',
  '"green",130,2'
]
 */

然后我们在这个数组上调用 join() 并使用 '\r\n' 字符串作为分隔符，以创建一个带有 CSV 标题的字符串，并且每个 CSV 行位于单独的行中。

const headerString = ['color', 'maxSpeed', 'age'];const rowItems = ['"red",120,2', '"blue",100,3', '"green",130,2'];console.log([headerString, ...rowItems].join('\r\n'));
/*
color,maxSpeed,age
"red",120,2
"blue",100,3
"green",130,2
 */

关注七爪网，获取更多APP/小程序/网站源码资源！