CSVデータを表示する

<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>CSVファイルを表示する</title>
<script type="text/javascript" src="prototype.js"></script>
<script type="text/javascript"><!--
function loadDataFile(fName)
{
new Ajax.Request(fName, { method: 'get', onComplete: displayData });
}
function displayData(httpObj)
{
$("result").innerHTML = parseTabText(httpObj.responseText);
}
// CSVファイルを解析して表示
function parseTabText(tabText)
{
var resultText = "<table border='1' cellspacing='0'>";
var CR = String.fromCharCode(13); // 改行コード (CR)
lineData = tabText.split(CR);
for (var i=0; i<lineData.length; i++)
{
wCount = lineData[i].split(",");
resultText += "<tr>";
for (j=0; j<wCount.length; j++)
{
tData = wCount[j]; // データ
resultText += "<td>"+tData + "</td>";
}
resultText += "</tr>";
}
resultText += "</table>";
return resultText;
}
// --></script>
</head>
<body>
<h1>CSVファイルを表示する</h1>
<form>
<input type="button" value="sample.csvファイルを読み込み" onClick="loadDataFile('sample.csv')"><br>
</form>
<div id="result"></div>
</body>
</html>

・サンプルを実行する
Ajax逆引きクイックリファレンス　説明などは本書を参考にしてください。