Улучшение производительности Javascript

Question

Я пытаюсь улучшить следующий код (для счетчика кнопок), но я не уверен в первоначальной проверке.

document.querySelectorAll("#minus")[0].addEventListener("click", function(e){
  e.stopPropagation();
  document.querySelectorAll("#number")[0].innerText = Number(document.querySelectorAll("#number")[0].innerText) - 1
})

document.querySelectorAll("#plus")[0].addEventListener("click", function(e) {
  e.stopPropagation();
  document.querySelectorAll("#number")[0].innerText = Number(document.querySelectorAll("#number")[0].innerText) + 1
})

Как бы я сделал этот код более эффективным?

Я также собираюсь добавить правило, при котором счетчик не может достигнуть нуля.

Спасибо за любую помощь:)

Answer 1

Вы можете сократить его, используя querySelector, и добавить условие, как показано ниже:

var num = document.querySelector("#number")
, plus = document.querySelector("#plus")
, minus = document.querySelector("#minus")

minus.addEventListener("click", function(e){
  var value = Number(num.innerText)
  num.innerText = value === 1 ? 1 : value - 1
})

plus.addEventListener("click", function(e) { 
  num.innerText = Number(num.innerText) + 1
})

div{ text-align: center; cursor: pointer; width: 100px; outline: 1px solid blue; }

<div id="plus">+</div>
<div id="minus">-</div>
<div id="number">1</div>