JS Devtool Debugger

<!-- preso da https://developer.chrome.com/docs/devtools/javascript/ -->
<!DOCTYPE html>
<html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <link rel="shortcut icon" href="https://googlechrome.github.io/devtools-samples/favicon-96x96.png">
    <title>Debugging JavaScript</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <style>
      h1 {
        font-size: 1.5em
      }
      input, button {
        min-width: 72px;
        min-height: 36px;
        border: 1px solid grey;
      }
      label, input, button {
        display: block;
      }
      input {
        margin-bottom: 1em;
      }
    </style>
  </head>
  <body>
    <h1>Debugging JavaScript</h1>
    <label for="num1">Numero 1</label>
    <input placeholder="Numero 1" id="num1">
    <label for="num2">Numero 2</label>
    <input placeholder="Numero 2" id="num2">
    <button>Somma di Numero 1 e Numero 2</button>
    <p></p>
    <script>
      function onClick() {
  if (inputsAreEmpty()) {
    label.textContent = 'Errore: almeno uno dei valori è vuoto.';
    return;
  }
  updateLabel();
}
function inputsAreEmpty() {
  if (getNumber1() === '' || getNumber2() === '') {
    return true;
  } else {
    return false;
  }
}
function updateLabel() {
  var addend1 = getNumber1();
  var addend2 = getNumber2();
  var sum = addend1 + addend2;
  label.textContent = addend1 + ' + ' + addend2 + ' = ' + sum;
}
function getNumber1() {
  return inputs[0].value;
}
function getNumber2() {
  return inputs[1].value;
}
var inputs = document.querySelectorAll('input');
var label = document.querySelector('p');
var button = document.querySelector('button');
button.addEventListener('click', onClick);

    </script>


</body></html>