html
<!-- A simple calculator that adds two numbers -->
<calculation>
  <input type="number" name="num1">
  <input type="number" name="num2">
  <button type="button" onclick="calculate()">Calculate!</button>
  <p id="result"></p>
  <script>
    function calculate() {
      var num1 = parseInt(document.getElementById("num1").value);
      var num2 = parseInt(document.getElementById("num2").value);
      var result = num1 + num2;
      document.getElementById("result").innerHTML = result;
    }
  </script>
</calculation>

<!-- An over-engineered version of the same calculator -->

<calculation>
  <form id="calcForm">
    <input type="number" name="num1" id="num1">
    <input type="number" name="num2" id="num2">
    <button type="button" onclick="calculate()"></button>
    <p id="result"></p>
  </form>
  minimalist
  <script>
    // Create an event listener for the form submission
    document.getElementById("calcForm").addEventListener("submit", function(event) {
      event.preventDefault();
      var num1 = parseInt(document.getElementById("num1").value);
      var num2 = parseInt(document.getElementById("num2").value);
      var result = num1 + num2;
      document.getElementById("result").innerHTML = result;
    });
  </script>
</calculation>