new Image() , appendChild를 이용해서 이미지 보여주는 방법

Ahn·2021년 10월 2일
0
post-thumbnail

const img = new Image();
img.src = "https://codebootcamp.co.kr/images/main/homeImage1.webp";

새로운 이미지를 만들고, src에 이미지 주소 넣음.
이미지를 제대로 받아왔다면 onload가 실행되고, imageTag
이미지 정보가 저장이 된다.

이미지 보여주기라는 버튼을 클릭하면, divRef를 동해서 이미지가 적용 되는데
appendChild(imageTag) 이건 div태그의 자식으로 imageTag가
들어가라는 뜻임. <div ref={divRef}>{imageTag}</div> 이렇게 되는 거임.

그래서 이미지 보여주기라는 버튼을 누르면 이미지가 보인다.

profile
Hello~~👋

0개의 댓글