부트캠프를 시작한지 벌써 2주차가 다되어간다. 오늘은 시작부터 pairprogramming을 진행했다. 1주차에 html과 css를 이용하여 계산기를 목업 만들었다. 이번 시간에는 js를 이용하여 실제로 계산이 가능한 계산기를 구현하는 것이 미션이었다.
nightmare까지 모든 테스트를 꾸역꾸역 통과하였지만 실제로 계산했을 때 나타나는 버그들이 꽤 많았다. 처음부터 깔끔하게 순서도를 그리면서 했어야하는데 또 귀차니즘이 발동해서 되는데로 작성하다보니 코드가 많이 더러워진것 같다...
안되는게 있으면 flag 사용해서 동작만 가능하도록 만든 느낌..
이번 주말에 다시 순서도를 그리면서 좀 더 깔끔한 코드의 계산기를 만들어봐야겠다.
무엇보다 js를 이용하여 css를 바꿔본 경험이 부족하여 버튼을 클릭했을 때 원하는 스타일을 적용하는 게 힘들었다.
연산자 버튼을 하나 클릭하면 해당 버튼만 색이 변하는 것을 만들고 싶었다. target console로 하나하나 찍어가면서 겨우 완성할 수 있었다.
남는 시간에 js를 이용하여 css 다루는 방법을 공부해야겠다..
innerHTML과 textContent의 차이
동작방식과 반환하는 값이 다르다.
innerHTML : HTML요소의 내부 HTML 코드를 나타내는 문자열을 반환하거나 설정. 즉 요소 내에 존재하는 모든 HTML 태그와 텍스트를 포함하여 반환
textContent : HTML 요소의 내부 텍스트 콘텐츠를 나타내는 분자열을 반환. 요소 내에 존재하는 모든 HTML 태그는 무시되고 순수한 텍스트만 반환.