一个文件夹的自我介绍

#folder2tree

用字符展示文件夹结构

前言 Before:

如何介绍一个文件夹,简直纠结。

要么图片,如果在截图前,你真的愿意,一层一层一层的剥开我的心。你会鼻酸你会流泪;
要么靠说,那么你可能得这么说:从前,有一个文件夹,文件夹里有两张图片;大图片在跟小图片讲故事…讲个什么故事额

因而,用纯字符描述文件夹的小工具必须得有呀。github here.

使用 Usage:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
@param {Dom} 父级dom节点
@param {Array} 描述文件夹层级关系对象
folder2tree.init(document.getElementById("ctn"), [
{
"img" : [
"sprite.png",
"bg.png"
]
},{
"js": [{
"common": [
"jquery.js",{
"highcharts": [{
"modules": ["exporting.js"]
},
"highcharts.js"
]}
]
},{
"index": [
"mian.js",{
"modules": ["mod.video.js"]
}
]
}]
},{
"css": [
"base.css",
"index-main.css",
"index-video.css"
]
},
"index.html",
"favicon.ico"
]);

展示 Show:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
├─img
│ ├─sprite.png
│ └─bg.png
├─js
│ ├─common
│ │ ├─jquery.js
│ │ └─highcharts
│ │   ├─modules
│ │   │ └─exporting.js
│ │   └─highcharts.js
│ └─index
│   ├─mian.js
│   └─modules
│     └─mod.video.js
├─css
│ ├─base.css
│ ├─index-main.css
│ └─index-video.css
├─index.html
└─favicon.ico
梦周十<br>炎黄子孙,生活在华夏大地<br><br>热爱大海与冷笑话,<br/>目前是一枚前端<br/><br/>胆小认生,不易相处,<br>年轻无为,卖马为生。