Tuesday, 9 July 2019

arithmatic operations page using html css and javascript



<html>
<head> </head>
<body bgcolor=cyan text=orange>
<center>
<h3>Javascript Programming</h3>
<hr/>
<table>
<tr>
<th>First Number:</th>
<td><input type="text" id="t1" value=" "/></td></tr>
<tr><th>Second Number:</th>
<td><input type="text" id="t2" value=" "/><td></tr>
<tr><td><input type="button" onclick="f1()" value="sum"/>
<input type="button" onclick="f2()" value="sub"/>
<input type="button" onclick="f3()" value="mul"/>
<input type="button" onclick="f4()" value="div"/>
</td></tr>
<tr><td><p id="p1"> </p>
<p id="p2"> </p>
<p id="p3"> </p>
<p id="p4"> </p></td></tr>
<script>
function f1()
{
var obj1=document.getElementById("t1");
var obj2=document.getElementById("t2");
var obj3=document.getElementById("p1");
var x=parseInt(obj1.value);
var y=parseInt(obj2.value);
var z=x+y;
obj3.innerText="sum Results:"+z;
}
function f2()
{
var obj1=document.getElementById("t1");
var obj2=document.getElementById("t2");
var obj3=document.getElementById("p2");
var x=parseInt(obj1.value);
var y=parseInt(obj2.value);
var z=x-y;
obj3.innerText="sub Results:"+z;
}
function f3()
{
var obj1=document.getElementById("t1");
var obj2=document.getElementById("t2");
var obj3=document.getElementById("p3");
var x=parseInt(obj1.value);
var y=parseInt(obj2.value);
var z=x*y;
obj3.innerText="mul Results:"+z;
}
function f4()
{
var obj1=document.getElementById("t1");
var obj2=document.getElementById("t2");
var obj3=document.getElementById("p4");
var x=parseInt(obj1.value);
var y=parseInt(obj2.value);
var z=x/y;
obj3.innerText="div Results:"+z;
}

</script>
</table>
</center>
</body>
</html>
















No comments:

Post a Comment