이미지가 로드되었는지 확인하기 위해 JavaScript를 사용하는 3가지 방법

프런트엔드 개발 작업에서는 이미지 정보를 얻기 위해 이미지가 로드된 후 이미지의 크기를 정확하게 얻고 해당 콜백 함수를 실행하여 이미지에 대한 특정 표시 효과를 생성해야 하는 경우가 있습니다. 이 기사에서는 주로 이미지 로드 시기를 판단하는 몇 가지 일반적인 JavaScript 방법을 정리하고 코드와 실제 응용 프로그램의 조합을 통해 설명합니다.

로드 방법

img 태그에 onload 속성을 추가하고 해당 함수를 채워 후속 javascipt 코드를 실행합니다. 다음 코드 예제에서는 img 요소가 기본적으로 표시되지 않습니다. Onload는 로드가 완료된 후 이미지가 표시되는지 확인하는 데 사용됩니다.

코드 복사 코드는 다음과 같습니다.