【JavaScriptの基礎】曜日を表示

曜日を表示

for文

<span class="synComment">&lt;!DOCTYPE html&gt;</span>
<span class="synIdentifier">&lt;</span><span class="synStatement">html</span> <span class="synType">lang</span><span class="synIdentifier">=</span><span class="synConstant">"ja"</span><span class="synIdentifier">&gt;</span>
<span class="synIdentifier">&lt;</span><span class="synStatement">head</span><span class="synIdentifier">&gt;</span>
<span class="synIdentifier">&lt;</span><span class="synStatement">meta</span> <span class="synType">charset</span><span class="synIdentifier">=</span><span class="synConstant">"UTF-8"</span><span class="synIdentifier">&gt;</span>
<span class="synIdentifier">&lt;</span><span class="synStatement">title</span><span class="synIdentifier">&gt;</span>for文の練習 - 配列<span class="synIdentifier">&lt;/</span><span class="synStatement">title</span><span class="synIdentifier">&gt;</span>
<span class="synIdentifier">&lt;/</span><span class="synStatement">head</span><span class="synIdentifier">&gt;</span>
<span class="synIdentifier">&lt;</span><span class="synStatement">body</span><span class="synIdentifier">&gt;</span>
<span class="synIdentifier">&lt;</span><span class="synStatement">h2</span> <span class="synType">id</span><span class="synIdentifier">=</span><span class="synConstant">"ans"</span><span class="synIdentifier">&gt;</span>ここに表示<span class="synIdentifier">&lt;/</span><span class="synStatement">h2</span><span class="synIdentifier">&gt;</span>
<span class="synIdentifier">&lt;</span><span class="synStatement">p</span><span class="synIdentifier">&gt;&lt;/</span><span class="synStatement">p</span><span class="synIdentifier">&gt;</span>
<span class="synIdentifier">&lt;</span><span class="synStatement">script</span><span class="synIdentifier">&gt;</span>
<span class="synIdentifier">var</span><span class="synSpecial"> today = </span><span class="synStatement">new</span> <span class="synType">Date</span>()<span class="synSpecial">;</span>
<span class="synIdentifier">var</span><span class="synSpecial"> day = today.getDay</span>()<span class="synSpecial">;</span>
<span class="synIdentifier">var</span><span class="synSpecial"> weekJa = </span><span class="synIdentifier">[</span><span class="synConstant">'日'</span><span class="synSpecial">,</span><span class="synConstant">'月'</span><span class="synSpecial">,</span><span class="synConstant">'火'</span><span class="synSpecial">,</span><span class="synConstant">'水'</span><span class="synSpecial">,</span><span class="synConstant">'木'</span><span class="synSpecial">,</span><span class="synConstant">'金'</span><span class="synSpecial">,</span><span class="synConstant">'土'</span><span class="synIdentifier">]</span><span class="synSpecial">;</span>
<span class="synIdentifier">var</span><span class="synSpecial"> weekImg = </span><span class="synIdentifier">[</span><span class="synConstant">'sunday'</span><span class="synSpecial">,</span><span class="synConstant">'monday'</span><span class="synSpecial">,</span><span class="synConstant">'tuesday'</span><span class="synSpecial">,</span><span class="synConstant">'wednesday'</span><span class="synSpecial">,</span><span class="synConstant">'thursday'</span><span class="synSpecial">,</span><span class="synConstant">'friday'</span><span class="synSpecial">,</span><span class="synConstant">'saturday'</span><span class="synIdentifier">]</span><span class="synSpecial">;</span>
<span class="synStatement">for</span> (<span class="synIdentifier">var</span><span class="synSpecial"> i = </span>0<span class="synSpecial">; i &lt; weekJa.length; i++</span>) <span class="synIdentifier">{</span>
<span class="synSpecial">  console.log</span>(<span class="synSpecial">weekJa</span><span class="synIdentifier">[</span><span class="synSpecial">i</span><span class="synIdentifier">]</span><span class="synSpecial">+</span><span class="synConstant">'曜日'</span>)<span class="synSpecial">;</span>
<span class="synIdentifier">}</span>
<span class="synIdentifier">var</span><span class="synSpecial"> element = </span><span class="synStatement">document</span><span class="synSpecial">.getElementById</span>(<span class="synConstant">'ans'</span>)<span class="synSpecial">;</span>
<span class="synSpecial">element.innerHTML = </span><span class="synConstant">'&lt;img src="img/'</span><span class="synSpecial"> +weekImg</span><span class="synIdentifier">[</span><span class="synSpecial">day</span><span class="synIdentifier">]</span><span class="synSpecial">+ </span><span class="synConstant">'.png" alt="'</span><span class="synSpecial"> +weekImg</span><span class="synIdentifier">[</span><span class="synSpecial">day</span><span class="synIdentifier">]</span><span class="synSpecial">+ </span><span class="synConstant">'"&gt;'</span><span class="synSpecial">;</span>
<span class="synIdentifier">&lt;/</span><span class="synStatement">script</span><span class="synIdentifier">&gt;</span>
<span class="synIdentifier">&lt;/</span><span class="synStatement">body</span><span class="synIdentifier">&gt;</span>
<span class="synIdentifier">&lt;/</span><span class="synStatement">html</span><span class="synIdentifier">&gt;</span>

<!DOCTYPE html>

<head>

<title>for文の練習 - 配列</title>

</head>

<body>

<h2 id="ans">ここに表示</h2>

<p></p>

var today = new Date();

var day = today.getDay();

var weekJa = ['日','月','火','水','木','金','土'];

var weekImg = ['sunday','monday','tuesday','wednesday','thursday','friday','saturday'];

for (var i = 0; i < weekJa.length; i++) {

console.log(weekJa[i]+'曜日');

}

var element = document.getElementById('ans');

element.innerHTML = '<img src="img/' +weekImg[day]+ '.png" alt="' +weekImg[day]+ '">';

</script>

</body>

</html>

月	火	水	木	金	土	日
		1	2	3	4	5
6	7	8	9	10	11	12
13	14	15	16	17	18	19
20	21	22	23	24	25	26
27	28	29	30	31

月	火	水	木	金	土	日
		1	2	3	4	5
6	7	8	9	10	11	12
13	14	15	16	17	18	19
20	21	22	23	24	25	26
27	28	29	30	31