<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>CSV読み込みアプリ</title>
<script type="text/javascript">
function loadData() {
// csvファイル読み込み
let xhr = new XMLHttpRequest();
xhr.open("GET", "data.csv", true);
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
// csvファイルを文字列に変換
let csvData = xhr.responseText;
// カンマで分割して配列に変換
let dataArray = csvData.split(",");
// ボタンを作成
let buttonArea = document.getElementById("button-area");
for (let i = 0; i < dataArray.length; i++) {
let button = document.createElement("button");
button.innerText = dataArray[i];
button.addEventListener("click", function() {
// コピー
let copyText = document.createElement("textarea");
copyText.value = dataArray[i];
document.body.appendChild(copyText);
copyText.select();
document.execCommand("copy");
document.body.removeChild(copyText);
});
buttonArea.appendChild(button);
}
}
};
xhr.send(null);
}
window.onload = loadData;
</script>
</head>
<body>
<h1>CSV読み込みアプリ</h1>
<div id="button-area"></div>
</body>
</html>
ジョーク：「CSVファイルが読めるアプリって、csvを探そうとするとセッションビールが出てくると思ってたんだけど（笑）」
