인덱스 안에 들어갈 내용이 많아 축소 기재하고싶습니다..

2023.10.04 14:32:26 1466 (175.♡.♡.185)

본문


<img src="<?php echo G5_THEME_IMG_URL; ?>/ban01.jpg" alt="" id="Slide" width="100%" height="fit-content">
 
<script>
        let slide = document.getElementById("Slide");
        let imgArr = [
          "<?php echo G5_THEME_IMG_URL; ?>/ban01.jpg", "<?php echo G5_THEME_IMG_URL; ?>/ban02.jpg", "<?php echo G5_THEME_IMG_URL; ?>/ban03.jpg",
          "<?php echo G5_THEME_IMG_URL; ?>/ban04.jpg", "<?php echo G5_THEME_IMG_URL; ?>/ban05.jpg", "<?php echo G5_THEME_IMG_URL; ?>/ban06.jpg",
          "<?php echo G5_THEME_IMG_URL; ?>/ban07.jpg", "<?php echo G5_THEME_IMG_URL; ?>/ban08.jpg", "<?php echo G5_THEME_IMG_URL; ?>/ban09.jpg",
          "<?php echo G5_THEME_IMG_URL; ?>/ban10.jpg", "<?php echo G5_THEME_IMG_URL; ?>/ban11.jpg", "<?php echo G5_THEME_IMG_URL; ?>/ban12.jpg",
          "<?php echo G5_THEME_IMG_URL; ?>/ban13.jpg", "<?php echo G5_THEME_IMG_URL; ?>/ban13.jpg", ~ (대충 54장까지 있습니다)
        ];
 
        setInterval(()=>{
            let ranNum = Math.floor(Math.random() * imgArr.length);
            slide.src= imgArr[ranNum];
        },4000);
</script>

imgArr에 적힌 요소를 인덱스로 해서 랜덤한 숫자에 해당되는 인덱스의 이미지가 보이게 자바로 슬라이드를 만들었습니다

사진을.... 54장 넣어야하는데 imgArr 안의 내용을 간편하게 축소할 수 있는 방법은 없을까요?

(링크1) ~ (링크54) 이런 느낌으로...

#그누보드5 #php

답변 3

웹메이킹 자기소개 회원게시물 회원 질문검색 회원 답변검색 회원 댓글검색 님의 답변

2023-10-04 14:40:11 118.♡.♡.157

반복문을 사용해서 다음과 같이 해 볼 수 있을것 같습니다


let imgArr = [];
for (let i = 1; i <= 54; i++) {
  imgArr.push(`<?php echo G5_THEME_IMG_URL; ?>/ban${i < 10 ? '0' : ''}${i}.jpg`);
}
// 나머지 코드는 이전과 동일합니다.

위의 코드를 사용하면 imgArr 배열에 1부터 54까지의 이미지 URL이 생성되고, 이를 랜덤하게 표시할 수 있습니다. 이렇게 하면 배열을 일일히 작성하는 번거로움을 줄일 수 있습니다.