其他分享
首页 > 其他分享> > 使用js实现一个复利计算器的HTML网页

使用js实现一个复利计算器的HTML网页

作者:互联网

个人的一个小作业,仅供参考,希望对你有所帮助。

界面:

代码:

<!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>

 

标签:sum,pri,value,js,getElementById,HTML,计算器,var,document
来源: https://blog.csdn.net/lgd123abc/article/details/122541778