html 태그
랜덤 한 이미지가 들어갈 img 같은 태그는 작성하지 않는다.
자바스크립트를 이용해서 만들 것이다.
js스크립트로 태그 만들기
images라는 변수에 image폴더 안의 이미지 파일들과 같은 이름의 값들을 배열에 담는다.
choiceImage변수는 랜덤 한 숫자를 뱉는 Math.random을 사용했는데, 0~1까지의 랜덤 한 수를 내뱉기 때문에
저것만 가지고는 배열의 위치 값을 불러올 수 없다.
그래서 그 랜덤 값에 명언의 길이만큼을 곱해주고, 소수점은 버려야 하니 Math.floor를 사용한다.
예를 들어, 0.123이라는 랜덤 한 값이 나왔다면 명언의 길이(개수)인 10을 곱하고 소수점은 버리게 되니, 1이 나오게 되고
명언 배열의 1번 위치의 값을 출력하게 된다.
bgImage 변수는 createElement를 사용하여 img라는 태그를 생성한다.
bgImage.classList.add는 css에 사용하려고 넣은 클래스 이름이니 신경 쓰지 않아도 된다.
bgImage변수의 src는 image/라는 문자열과 choiceImage 변수를 출력하게 된다.
나는, bgImage변수와 bgImage.src, choiceImage로
<img class="bgimg" src="image/9.jpg">을 허공에 만든 후,
appendChild로 document.body에 bgImage을 넣는다고 생각하는 게 이해하기 편했다.
