4 урок классная работа

In this example below you will see how to do a 4 урок классная работа with some HTML / CSS and Javascript

Thumbnail
This awesome code was written by onlyjoke, you can see more from this user in the personal repository.
You can find the original code on Codepen.io
Copyright onlyjoke ©
  • HTML
  • JavaScript
<!DOCTYPE html>
<html lang="en" >

<head>
  <meta charset="UTF-8">
  <title>4 урок классная работа</title>
  
  
  
  
  
</head>

<body>

  <input type="text" class="b-first">
<input type="text" class="b-second">
<div class="b-wrap">
  <input type="button" value="+">
  <input type="button" value="-">
  <input type="button" value="*">
  <input type="button" value="/">
</div>
<div class="b-result"></div>
  
  

    <script  src="js/index.js"></script>




</body>

</html>

/*Downloaded from https://www.codeseek.co/onlyjoke/4-andx443andx440andx43eandx43a-andx43aandx43bandx430andx441andx441andx43dandx430andx44f-andx440andx430andx431andx43eandx442andx430-mpGYNp */
var getBtns = document.querySelector('.b-wrap');
var getResult = document.querySelector('.b-result');
getBtns.addEventListener('click', 
  function(e) {
  var getFirstValue = document.querySelector('.b-first').value;
  var getSecondValue = document.querySelector('.b-second').value;
    var target = e.target.value;
    switch (target) {
      case "+":
        getResult.innerHTML = (+getFirstValue + +getSecondValue);
        break;
      case "/":
        getResult.innerHTML = (getFirstValue / getSecondValue);
        break;
      case "*":
        getResult.innerHTML = (getFirstValue * getSecondValue);
        break;
      case "-":
        getResult.innerHTML = (getFirstValue - getSecondValue);
        break;
    }
  }
);

Comments