이미지 태그 안의 src 값이 실제 파일로 존재하는지 확인

// 모든 이미지 태그를 선택합니다.
const imgElements = document.querySelectorAll('img');

// 각 이미지 태그의 src 속성을 확인하여 이미지를 로드하고 존재 여부를 판단합니다.
imgElements.forEach(img => {
  const image = new Image();
  
  image.onload = function() {
    console.log('이미지가 로드되었습니다:', img.getAttribute('src'));
  };
  
  image.onerror = function() {
    console.log('이미지 로드에 실패했습니다:', img.getAttribute('src'));
  };
  
  image.src = img.getAttribute('src');
});

 

 

위의 코드에서는 각 이미지 태그마다 새로운 Image 객체를 생성하고, 해당 이미지의 src 값을 할당하여 이미지를 로드합니다. 이미지 로드가 성공하면 onload 핸들러가 호출되고, 이미지 로드가 실패하면 onerror 핸들러가 호출됩니다.

이 코드를 사용하면 페이지의 모든 이미지 태그에 대해 이미지가 로드되는지 여부를 확인할 수 있습니다.