请问纯静态网页有什么办法读取目录下的 csv 文件吗？

This topic created in 2714 days ago, the information mentioned may be changed or developed.

我现在用 html+css+js 编写了一个静态的相册网站，但是想要在加载网页的时候即时的从网站文件根目录下读取一个 csv 配置文件（里面有图片的文件名、描述等信息），然后即时加载到网站的 body 里面，以实现只需要修改资源文件夹就可以动态更新网页。不知道有没有办法，把 html 同目录下的 csv 文件读取进入 js 脚本？跪谢

csv

文件

读取

17 replies

lhx2008

Dec 22, 2018 via Android

可以读进来，没问题，但是代码没人帮你免费写了

lhx2008

Dec 22, 2018 via Android

发一个 ajax 请求就读进来了

learnshare

Dec 22, 2018

每次更新完文件，gulp 或 webpack 构建一下，输出为包含内容的 HTML 即可

kY8mbXW833Lu28xn

Dec 22, 2018 via Android

可以，js 可以做到这个功能，Google 一下，很多的案例

Aoitechs

Dec 22, 2018

@lhx2008 ajax 请求是异步的，读取完之后覆盖更新 div 就会导致其他的样式 js 不生效，如果改成同步的 ajax，会导致一直有一个 warning

Aoitechs

Dec 22, 2018

@learnshare 有没有不需要二次构建的办法呢，因为做出来的相册想提供给别人用最好就是可以只是上传图片和修改 csv，网站刷新一下就变了那种

learnshare

Dec 22, 2018

@Aoitechs JS 不生效，是 JS 事件处理做的不太对。
关键词：事件委托或者 https://api.jquery.com/on/

hoyixi

Dec 22, 2018

@Aoitechs #6

定好 csv 目录路径，定好 csv 结构，只需要构建一次，构建完成后的那个 js 文件，扔给你的客户，以后他只要按照要求放正确的 csv 即可。

Arnie97

Dec 22, 2018 via Android

正好我做过类似的功能 https://github.com/evanplaice/jquery-csv

Aoitechs

Dec 22, 2018

@Arnie97 emmmmm 我的问题不在于处理 csv，而是怎么能把 csv 读进来。。。

hoyixi

Dec 22, 2018

@Aoitechs

不想用非 DOM API，不想用构建工具的话，最简单的方法就是不用 csv，用 json 文件，ajax 加载。

Aoitechs

Dec 22, 2018

@hoyixi ajax 加载 json 和加载 csv 实质上差不多吧？主要目前异步 ajax 会出现别的问题（#5 ）

或者说有什么办法可以让静态网站读取一个同目录下的配置文件（不管是 json or csv ），然后作为一个参数参与到 js 后续的处理（主要是循环）中呢？

hoyixi

Dec 22, 2018

@Aoitechs

是得，ajax 加载 json 和加载 csv 实质上一样，但是加载 json 不用再自己写或者引入专门解析 csv 的 js 代码了；

“异步 ajax 会出现别的问题”，感觉你好像是想在不改原有代码的基础上修补。但是很多情况不改是不可能的。你没贴代码，也没有实例，别人也没法明白你这个问题。

你静态页面里的 js 是在网页访问者的浏览器里运行的，要想读你服务器磁盘里的文件，除非通过 HTTP 请求文件方式，例如 ajax。

night98

Dec 22, 2018 via Android

d3.js 好像有直接加载 csv 的方法

MonoLogueChi

Dec 22, 2018 via Android

所以说，你的问题不是怎么读取，而是怎么渲染？

Aoitechs

Dec 22, 2018

感谢 @hoyixi 和 @learnshare 提供的思路现在找到合适的解决方案了

pynix

Dec 22, 2018

JS 就行了吧。。。