CSV数据和JS / HTML

时间:2013-07-08 14:34:27

标签: javascript html csv

是否可以使用客户端JS从位于URL的CSV文件中打开并提取(到数组中)数据?如果是这样,有人可以解释一下如何做到这一点,因为我正在努力研究如何使用JQuery,因为示例似乎永远不会打开csv,他们只使用csv作为变量(暗示我知道如何获取首先是代码中的代码 - 我没有这样做

我需要在我的浏览器中将一些天气数据输入JS阵列,我将从中生成一些仪表来显示风速和风向。

我的CSV目前在此处托管:http://mrmoneymotivator.com/windspeed/windspeed.csv并且其中包含一些虚拟数据。

我目前正在考虑获取仪表的第一行数据(将定期刷新)。一旦我有了工作,我将使用数组数组在图表中显示历史数据。

非常感谢提前!

2 个答案:

答案 0 :(得分:3)

如果CSV和包含JavaScript的文档是从同一提供的,那么您当然可以这样做。 (更多:Same Origin Policy

您可以使用XMLHttpRequest object检索数据,然后将其作为文本返回给您。然后,根据CSV数据的复杂程度,它可以像使用String#splitspecMDN)获取行数组(行)一样简单,然后使用{ {1}}再次在循环中获取每行的值数组。我说“取决于复杂性”,因为CSV是一种比人们有时怀疑的更复杂的格式,涉及可以包含换行符和逗号的引用单元格。但是,如果您的数据不使用这些功能,那么只需要进行几次String#split次调用即可。如果您的数据 使用更多功能,您可能需要找到一个处理full RFC的解析的库。

以下是一个完整的示例:Live Copy | Live Source

split

答案 1 :(得分:1)

  1. Ajax CSV文件
  2. 要么使用库(我相信你能够单独搜索JS CSV :))

    用'\ n'分割得到Rows并再用','拆分得到值...
        注意:有时CSV将值设置为“标记,以便准备就绪。

    我使用的文件夹位于:https://code.google.com/p/jquery-csv/

    <script type="text/javascript" src="jquery-csv.js"></script> 
    <script type="text/javascript">
    $.ajax({
       url: "http://www.example.com/report.csv",
       cache: false
    }).done(function( csvData ) {
         var arr2D = $.csv.toArrays(input);
    });
    </script>
    

    注意:未经测试!