//CSVファイルを読み込む関数getCSV()の定義 function addcontents(){ var req = new XMLHttpRequest(); // HTTPでファイルを読み込むためのXMLHttpRrequestオブジェクトを生成 req.open("get", "kankoti.csv", true); // アクセスするファイルを指定 req.send(null); // HTTPリクエストの発行 // レスポンスが返ってきたらconvertCSVtoArray()を呼ぶ req.onload = function(){ convertCSVtoArray(req.responseText); // 渡されるのは読み込んだCSVデータ } } // 読み込んだCSVデータを二次元配列に変換する関数convertCSVtoArray()の定義 function convertCSVtoArray(str){ // 読み込んだCSVデータが文字列として渡される var result = []; // 最終的な二次元配列を入れるための配列 var tmp = str.split("\n"); // 改行を区切り文字として行を要素とした配列を生成 // 各行ごとにカンマで区切った文字列を要素とした二次元配列を生成 for(var i=0;i<tmp.length;++i){ result[i] = tmp[i].split(','); } //result[1] = tmp[1].split(',');//実際のコンテンツ内容を入れる console.log(result); putcontent(result); } function putcontent(csv_text){ console.log("コンテンツ変更を開始"); var allcontents = {}; for(var n=0; n<csv_text.length; ++n){ let contents = {}; for(var i=0; i<csv_text[0].length; ++i){ let content = csv_text[n+1][i]; console.log(content); if(content){ contents[csv_text[0][i]] = content; } } allcontents[n] = contents; } console.log(allcontents); } function a(){ if(true){ document.getElementById("main").insertAdjacentHTML('beforeend', '<div class="section" id="' + i + '"></div>'); document.getElementById(i).innerHTML = "<header class=\"site-header\"><div class=\"header-list\"><img src=\"image/view_cloud01_01.png\" alt=\"site-logo\" class=\"header-logo\">" + "<ul><li class=\"menu\"><a class=\"menu1-url menu1\" href =\"" + contents["menu1-url"] + "\">" + contents["menu1"] + "</a></li><li class=\"menu\"><a class=\"menu2-url menu2\" href =\"" + contents["menu2-url"] + "\">" + contents["menu2"] + "</a></li><li class=\"menu\"><a class=\"menu3-url menu3\" href =\"" + contents["menu3-url"] + "\">" + contents["menu3"] + "</a></li><li class=\"menu\"><a class=\"menu4-url menu4\" href =\"" + contents["menu4-url"] + "\">" + contents["menu4"] + "</a></li></ul>" + "</div></header><div class=\"main\"><div class=\"top-image\"><img src=\"image/sample3.jpg\" alt=\"top-image\" class=\"top-img\"><h2 class=\"img-text top-image-text\">" + contents["top-text"] + "</h2></div>" + "<div class=\"about\"><h1 class=\"about-title1\">" + contents["main1-title1"] + "</h1><p class=\"about-text1\">" + contents["main1-text1"] + "</p></div></div>" + "<footer class=\"footer\"><p>Copyright (C) " + contents["copyright"] + " . All Rights Reserved.</p></footer>"; } console.log("あんこ追加"); }