<form>
  <input type="number" id="num1" placeholder="Enter number 1">
  <input type="number" id="num2" placeholder="Enter number 2">
  <button onclick="calculateSum()">Calculate Sum</button>
</form>

<p>The sum of the two numbers is: <output id="result"></output></p>
function calculateSum() {
  var num1 = Number(document.querySelector("#num1").value);
  var num2 = Number(document.querySelector("#num2").value);
  var sum = num1 + num2;
  var resultOutput = document.querySelector("#result");
  resultOutput.innerHTML = sum;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.