In: Computer Science
Create a html page to convert miles into kilometers, the page should have four buttons using FOR loop to convert values from 1-25, 25-50, 50-75, and 75-100
Upon clicking any of the four button, output should display the range miles to kilometers in table cell.
<!DOCTYPE html>
<html>
<body>
<h1>Miles into Kilometers Converter</h1>
<button onclick="myFunction1(1)">1-25</button>
<button onclick="myFunction1(2)">25-50</button>
<button onclick="myFunction1(3)">50-75</button>
<button onclick="myFunction1(4)">75-100</button>
<p id="demo"></p>
<script>
function myFunction1(data) {
document.getElementById("demo").innerHTML = "";
var text = "<table style='border: 1px solid
black;border-collapse: collapse;>";
var i;
if(data==1)
i=1;
if(data==2)
i=25;
if(data==3)
i=50;
if(data==4)
i=75;
n=i+25;
for (; i <=n; i++) {
text =text+"<tr><td>"+i+ " mile(s) =
</td><td>" + (i*1.6).toFixed(2) + " Km's
</td></tr>";
}
console.log(text);
text=text+"</table">
document.write(text);
}
</script>
</body>
</html>
