<html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Compound Interest Calculator</title>
<style>
body {
font-family: Arial, sans-serif;
text-align: center;
margin: 50px;
}
</style>
</head>
<body>
<h1>Compound Interest Calculator</h1>
<form id="compoundForm">
<label for="principal">Principal amount:</label>
<input type="number" id="principal" required><br>
<label for="interestRate">Annual interest rate (%):</label>
<input type="number" id="interestRate" step="0.01" required><br>
<label for="years">Number of years:</label>
<input type="number" id="years" required><br>
<button type="button" onclick="calculateCompoundInterest()">Calculate</button>
</form>
<h2 id="result"></h2>
<script>
function calculateCompoundInterest() {
var principal = parseFloat(document.getElementById('principal').value);
var interestRate = parseFloat(document.getElementById('interestRate').value);
var years = parseInt(document.getElementById('years').value);
var compoundInterest = principal * Math.pow(1 + (interestRate / 100), years) - principal;
document.getElementById('result').innerHTML = 'Compound Interest: $' + compoundInterest.toFixed(2);
}
</script>
</body>
</html>
No comments:
Post a Comment