//CSVファイルを読み込む関数getCSV()の定義
function getCSV(){
    var req = new XMLHttpRequest(); // HTTPでファイルを読み込むためのXMLHttpRrequestオブジェクトを生成
    req.open("get", "test.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"); // 改行を区切り文字として行を要素とした配列を生成
 
    // 各行ごとにカンマで区切った文字列を要素とした二次元配列を生成
    result[0] = tmp[0].split(',');//IDやClassの名前を入れる
    result[1] = tmp[1].split(',');//実際のコンテンツ内容を入れる
    console.log("CSV格納");

    putcontent(result);
}
 
function putcontent(csv_text){
    console.log("コンテンツ変更を開始");
	for(var i=0; i<csv_text[0].length;++i){
	var contents = document.querySelectorAll("." + csv_text[0][i]);
    console.log(contents);
	if(contents){
        for(content of contents)
            if (csv_text[0][i] == "header-logo" || csv_text[0][i] == "top-img" || csv_text[0][i] == "about-img1"){
                content.src = "image/" + csv_text[1][i];
                console.log("画像を変更");
            }else if(csv_text[0][i] == "menu1-url" || csv_text[0][i] == "menu2-url" 
                || csv_text[0][i] == "menu3-url" || csv_text[0][i] == "menu4-url"){
                    content.setAttribute("href",csv_text[1][i]);
                    console.log("URLを変更");
            }else{
                content.innerText = csv_text[1][i];
                console.log("テキストを変更");
            }
            console.log(csv_text[0][i] + "を" + csv_text[1][i] + "に変更");
        }
    }
}

getCSV(); //最初に実行される