<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>js test</title>
    <script src="script.js"></script>
</head>
<body>
  <p>Введите число: <input type="text" id="n1"></p>
  <p>Введите число: <input type="text" id="n2"></p>
  <button onclick="calculate('add')">Прибавить</button>
  <button onclick="calculate('sub')">Отнять</button>
  <hr>
  <p id="result"></p>
</body>
</html>
function calculate(operation) {
  let num1 = parseInt(document.getElementById('n1').value);
  let num2 = parseInt(document.getElementById('n2').value);
  let result = document.getElementById('result');
  if (isNaN(num1) || isNaN(num2)){
    result.innerHTML = 'Введите число!';
  }else if (operation === 'add') {
    result.innerHTML = num1 + num2;
  }else if (operation === 'sub') {
    result.innerHTML = num1 - num2;
  }
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.