-
img 폴더에 있는 이미지들과 images array 안의 요소 이름이 같도록 배열을 만든다.
-
js에서 image를 html에 추가해준다.
document.createElement 사용.
자바스크립트에서 html 태그를 만들어서 적용할 수 있다.
append(가장 뒤에 추가)하여 body에 이미지를 추가시킨다.(prepend는 가장 위에 추가)
const images = [
"01.jpg",
"02.jpg",
"03.jpg",
"04.jpg",
"05.jpg",
"06.jpg",
"07.jpg",
];
const chosenImage = images[Math.floor(Math.random() * images.length)];
const bgImage = document.createElement("img"); //<img> 생성
bgImage.src = `img/${chosenImage}`;
document.body.appendChild(bgImage); // body에 이미지 추가하기 - position 속성 : 문서상에 요소를 배치하는 방법 지정
relative : 요소 자기자신을 기준으로 배치
absolute: 가장 가까운 위치에 있는 부모 요소를 기준으로 배치
