Design a scientific calculator and make event for each button using scripting language

HTML CodeTry it

<!-- Design a scientific calculator and make event for each button using scripting language.-->

<body>
   <table>
      <tr>
         <td colspan="4"><input type="text" id="result" placeholder="0" /></td>
      </tr>
      <tr>
         <td><button id="C" onclick="clr()">C</button></td>
         <td><button id="z" onclick="def('/')">/</button></td>
         <td><button id="y" onclick="def('*')">*</button></td>
         <td><button id="x" onclick="def('-')">-</button></td>
      </tr>
      <tr>
         <td><button id="a" onclick="def('1')">1</button></td>
         <td><button id="b" onclick="def('2')">2</button></td>
         <td><button id="c" onclick="def('3')">3</button></td>
         <td rowspan="2"><button id="w" onclick="def('+')">+</button></td>
      </tr>
      <tr>
         <td><button id="d" onclick="def('4')">4</button></td>
         <td><button id="e" onclick="def('5')">5</button></td>
         <td><button id="f" onclick="def('6')">6</button></td>
      </tr>
      <tr>
         <td><button id="g" onclick="def('7')">7</button></td>
         <td><button id="h" onclick="def('8')">8</button></td>
         <td><button id="i" onclick="def('9')">9</button></td>
         <td rowspan="2"><button id="v" onclick="solve()">=</button></td>
      </tr>
      <tr>
         <td colspan="2"><button id="j" onclick="def('0')">0</button></td>
         <td><button onclick="def('.')">.</button></td>
      </tr>
   </table>
</body>

CSS CodeTry it

.body{
   padding: 15px;
}
input{
   padding: 10px;
   margin: 5px;
   width: 200px;
}
button{
   width: 100%;
   height: 100%;
}
td{
   width: 40px;
   height: 50px;
}
p{
   text-align: center;
   font-size: 30px;
   color: blue;
}

JavaScript CodeTry it

function def(val){
   document.getElementById("result").value+= val;
}
function clr(){
   document.getElementById("result").value = "";
}
function solve(){
   let x = document.getElementById("result").value;
   let y = eval(x);
   document.getElementById("result").value = y;
}

OutputTry it

Try it