이미지 등록 후 썸네일 보여주기/썸네일 크기 조절

function thumbnail(f){
  var file = f.files;
  var reader = new FileReader();
  reader.onload=function(a){
    document.getElementById('thumbnail_image').innerHTML='<img src="'+a.target.result+'">'
    document.getElementById('thumbnail_image').children[0].setAttribute('width',300);	//썸네일이 담길 이미지 width값 300px로 고정
    document.getElementById('thumbnail_image').style.height='300px';	//썸네일이 담길 div의 height값 300px로 세팅해주고
    document.getElementById('thumbnail_image').style.overflow = 'hidden';	//썸네일이 overflow되면 hidden으로 세팅
  }
  reader.readAsDataURL(file[0]);

• document.getElementById('thumbnail_image').children[0].setAttribute('width',300);
  이미지는 div('thumbnail_image') 하위요소에 들어가기 때문에 children으로 접근

• 그 밑에 두 줄
  이미지가 아닌 div에 height를 주고 overflow:hidden을 한 이유
  👉이미지에 height를 주면 비율무시하고 강제로 height값에 맞춰 이미지가 늘어나거나 줄어들어서 보기 싫었음
  👉그래서 이미지에는 width만 주고 길이가 넘치면 hidden 처리하고 비율 유지하려고 했음

나중에 또 잊어버리면 내 포스팅보려고 메모