以HTML显示CSV文件 [英] Display CSV file in HTML

问题描述

我正在尝试将带有标题的本地CSV文件导入到本地HTML文件中，然后该文件将在浏览器中显示为表格.

I'm trying to import a local CSV file with headings into a local HTML file, which will then display as a table in a browser.

我已经很长时间没有学习HTML和JavaScript了，所以我对导入和转换一无所知.我需要的是一些建议，或者可能是描述我需要的功能的基本脚本.欢迎大家提供解释和建议！

I haven't been learning HTMLand JavaScript for long, so I don't know a lot about importing and converting. What I need is some advice or possibly a basic script describing the sort of function I need. Explanations and advice are all welcomed!

这是csv文件的示例:

This is an example of the csv file:

    heading1,heading2,heading3,heading4,heading5
    value1_1,value1_2,value1_3,value1_4,value1_5
    value2_1,value2_2,value2_3,value2_4,value2_5
    value3_1,value3_2,value3_3,value3_4,value3_5
    value4_1,value4_2,value4_3,value4_4,value4_5
    value5_1,value5_2,value5_3,value5_4,value5_5

这就是我要显示的方式:

This is how I'd want to display it:

http://jsfiddle.net/yekdkdLm

推荐答案

获取外部文件.

您必须为此使用 xmlHttpRequest .使用jQuery(包括jQuery库)简化为.

You have to use xmlHttpRequest for this. Simplified using jQuery (include jQuery library) as.

您需要在本地服务器(例如Apache)中运行HTML文件，像Chrome这样的浏览器不允许 xml://用于 file://网址.

  $.ajax({
    type: "GET",
    url: "words.txt",
    dataType: "text",
    success: parseTxt
  });

使用成功回调处理数据

parseTxt 是读取文件内容并将其传递给的函数.然后，您可以在 parseTxt 中编写代码，以将文本作为字符串进行处理.

parseTxt is the function to which the content of the file is read and passed. You can then write the code in parseTxt to process the text as string.

function parseTxt(text){
  var rows=text.split('\n');

  //for each row
  //cols=rows[i].split(',');
}

我想这应该足以让您入门.

This should be enough to get you started I guess.

如何使用以下命令从服务器读取文本文件JavaScript?

您甚至可以使用 iframes 通过 Shadow Wizard 尝试解决上述问题.

You can even try the answer to above question by Shadow Wizard using iframes.

可以在没有jQuery的情况下进行RAW XMLHttpRequest ，如此处

A RAW XMLHttpRequest can be made without jQuery as shown here

这篇关于以HTML显示CSV文件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！