<html>

  <body>

    <div class="pictureRow1">

      <img class="pictures" src="" url="Project_watch.html" />

      <img class="pictures" src="" url="TestPage.html" />

      <img class="pictures" src="" url="Login.html" />

      <img class="pictures" src="" url="Logout.html" />

    </div>

  </body>


  <script type="text/javascript" src="function.js"></script>

</html>


const pictures = document.querySelectorAll(".pictures");


pictures.forEach((currentPicture) => {

  currentPicture.addEventListener("click", () => {

    const redirectURL = currentPicture.getAttribute("url");

    location.href = redirectURL;

  });

});


addEventListener로 class가 "pictures" 인 것만 모두 가져와서 이벤트 리스너를 만들자

클릭하면 해당 이미지의 url 프로퍼티에 해당하는 링크로 이동하게끔

더 좋은 방법들도 많겠지만 난 이게 떠올랐음

디시에서 막아놨는지 src 값들이 죄다 비어서 나오는데 스샷에 적힌 값 알아서 채우길 바람