내일배움캠프_TIL_2022.12.13

자바스크립트에서 getElemenyby~ 와 관련된 함수는 

해당 Id 또는 ClassName 등의 모든 정보를 불러온다.

전체적인 정보를 불러오기 때문에 html에 표시되는, 가령 <div class="...", id="..."></div>

와 같은 코드를 불러오기 위해서는 반드시 뒤에 인덱스 '[0]' 를 붙여야 하고

input 태그의 경우, 입력한 정보를 불러오기 위해서는 .value를 입력해야 한다.

 

(예시)

// 마이페이지 좌측 프로필 사진 부분
const myPage = document.getElementsByClassName('mypage')[0]
const mypageLeftSide = document.createElement('div')
mypageLeftSide.setAttribute('class', 'mypage-leftside')
myPage.appendChild(mypageLeftSide)
myPageProfile_fuc()

 

(이 단순한 것을 몰랐어서 심한 코드 낭비는 물론 시간도 많이 지체되었는데 기초를 더 탄탄히 해야 이런 터무니 없는 시행착오를 줄일 수 있겠다는 생각이 들었다.)