JavaScript로 계산기 기능 구현하기

 

 

지난번에 HTML,CSS로 만든 계산기 Mock-Up을 기반으로 계산기 기능을 구현해 봤다.

document.querySelector("클래스명")으로 자식을 포함한 해당엘리먼트의 정보를 모두 담을수 있었고

button.addEventListerner("click",function (event)) 로 클릭이벤트시 수행할 기능을 정의 할 수 있었다.

document.getElementsByClassName("클래스명") 으로 해당 클래스명에 해당하는 정보를 객체 형식으로 반환하여 정보를 가져오거나 추가, 삭제 할수 있었다.

 

추후에 버튼이벤트, querySelector의 동작 방식을 찾아 봐야겠다.

element = document.getElementsByClassName("operator");
    for (var i = 0; i < element.length; i++) {
  
      var temp = element.item(i); //HTML요소
      if (temp === target) {
        temp.classList.add("isPressed");
        savetarget = target;
      }
      else {
        temp.classList.remove("isPressed");
      }

 

 

 

https://github.com/kkdy21/calculator-mock-up.git