【Webデザイン勉強8日目】〜Part2〜

はいどうも！

今日も作業を積み上げました！

今日もJavaScriptの勉強を進めました！

use strict = エラーを発見しやすくしてくれる

const = 代入

Math.floor = 小数点以下を切り捨てる

Math.random() = 0〜1の間で、小数点以下の数字がランダムで選ばれる

for ( let i = 0; i < num; i++)   =  iは0で、num(今回で言うと5より小さい数字まで)まで、i++される（1ずつ増える）

const div = document.createElement('div');  =  divを作成

 div.classList.add('box');　=　class属性のboxを追加

「クリックしたとき、iがwinnerと一緒だったらテキストはwinと表示させて、classはwinを適用。それ以外(else)の時、loseを適用」

div.addEventListener('click' , () => {

if ( i === winner) {

  div.textContent = 'Win';

  div.classList.add(win');

} else {

div.textContent = 'Lose';

div.classList.add('lose');

「document.body.appendChild(div);」

divの親要素であるbodyに上記の指示を出さないとディスプレイに表示されないため、この指示は必須です。

以下はjsファイルを別で作って読み込む記述です。

HTMLファイル

jsファイル

\n = 改行

\t = タグ（大きめの余白）

デベロッパーツールのConsoleで見るとこんな感じ。

今日の作業は以上です！

今日は、ここまで！