JS. 리펙토링 중복제거

리펙토링

  <input id="night_day" type="button" value="night" onclick="
  var target =   document.querySelector('body');
  if(document.querySelector('#night_day').value === 'night'){
  target.style.backgroundColor = 'black';
  target.style.color = 'white';
  this.value = 'day';
  } else {
  target.style.backgroundColor = 'white';
  target.style.color = 'black';
  this.value = 'night';
  }
  ">

var을 사용하여 중복을 제거할 수 있다.

  <input type="button" value="night" onclick="
  if(this.value === 'night'){
  document.querySelector('body').style.backgroundColor = 'black';
  document.querySelector('body').style.color = 'white';
  this.value = 'day';
  } else {
  document.querySelector('body').style.backgroundColor = 'white';
  document.querySelector('body').style.color = 'black';
  this.value = 'night';
  }
  ">

this.value를 사용하면 버튼을 눌러도 night에서 day로 안바뀌었던 현상을 고칠 수 있다.