<img/> 이미지의 사이즈 구하기 && 이미지 원본 사이즈 구하기

<img src="/image/blah.jpeg"
	onLoad = {(e) => {
    	const img = e.target;
        console.log("img 넓이" , img.width);
        console.log("img 높이" , img.height);
        
        console.log("img 원본 넓이" , img.naturalWidth);
        console.log("img 원본 높이" , img.naturalHeight);
    }}
/>

onLoad는 이미지가 로드된후 실행하는 함수이다.

img.width를 찍어보면 이미지가 출력된 후의 조정된 사이즈(상의 div등에 의해) 가 출력된다

 

Intrinsic size (원본사이즈)가 알고싶다면, img.naturalWidth 로 알수있다.

 

 

Rendered size => img.width

Intrinsic size => img.naturalWidth