个人的一个小作业，仅供参考，希望对你有所帮助。
界面：
代码：
<!DOCTYPE html>
<!-- 复利计算器 -->
<!-- toFixed() 方法可把 Number 四舍五入为指定小数位数的数字。
parseFloat() 函数解析字符串并返回浮点数。
此函数确定指定字符串中的第一个字符是否为数字。如果是，它会解析字符串直到到达数字的末尾，并将数字作为数字而不是字符串返回。
注意：只返回字符串中的第一个数字！
注释：允许前导和尾随空格。
注释：如果第一个字符不能转换为数字，parseFloat() 返回 NaN。 -->
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<input id="p1" type="text" value="" placeholder="本金" />
<input id="p2" type="text" value="" placeholder="时长/年" />
<input id="p3" type="text" value="" placeholder="年利润%" />
<input id="p4" type="button" value="计算" onclick="f1();" />
<script>
function f1() {
var pri = document.getElementById("p1").value;
var years = document.getElementById("p2").value;
var pro = document.getElementById("p3").value/100;
var inter = 0;
var sum = 0;
for(var i = 1; i <= years; i++) {
inter = (pri * pro).toFixed(3);
sum = (parseFloat(pri) + parseFloat(inter)).toFixed(3);
document.write("第"+i+"年，本金"+pri+"，利息"+inter+"，总收益"+sum+"<br/>");
pri = sum;
}
}
</script>
</body>
</html>