您的位置：首页 > Web前端 > HTML

使用html页面实现简单的算法并通过百度网盘实现访问

2018-01-04 11:16 866 查看 
首先这篇博客主要是个思路，因为实现的方式有很多。
1.先讲下需求，这个需求本人经历，是这样的：假设有本金100000，那么多长时间会回本呢？
拿出计算机一条一条计算效率太低，而且本金变化的话还得重新算，于是想着写一个html页面进行算并且渲染出来。

2.代码逻辑相对并不是那么复杂，代码如下：


<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
</head>
<body>
<div>
总钱数：<input type="text" id="money">
天数：<input type="text" id="day">
<button id="search" onclick="calculate()">查询</button>
</div>
<div>
计算出的结果:
<ul id="result"></ul>
</div>
</body>
<script>
function calculate() {
var money = document.getElementById("money").value - 0;
var day = document.getElementById("day").value - 0;
var returnMoney = 0;
//要进行渲染的div
var result = document.getElementById("result");
result.innerText = "";
for(var i=1;i<=day;i++){
var interest = money*0.001;
interest = interest.toFixed(2) - 0;
returnMoney = returnMoney + interest;
returnMoney = returnMoney.toFixed(2) - 0;
money = money.toFixed(2) - 0;
money = money - interest;
var li = document.createElement("li");
li.innerText = '第'+i+'天；当天返息：'+interest+'；总共返息：'+returnMoney+'；剩余总金额：'+money;
result.appendChild(li);
}
}
</script>
</html>


3.保存为html文件，打开直接使用就行了，效果截图如下:



4.直接发给用户用打开html的方式太low了，而且经亲测ios端还无法在微信端通过浏览器打开这个html文件，简单的方案就是把这个文件放置到云服务端再提供给用户访问就行。但并不是每个人都有自己的云服务器毕竟云服务器还是要钱的，我这里再提供一个免费方式，就是利用百度云盘共享的方式将这个文件共享出去，也能达到云服务端的访问效果。以下为百度网盘共享地址：

https://pan.baidu.com/s/1jI3Wgom

5.总结：弄完之后之后觉得还蛮好玩的，分享出来给大家，还有大家有什么更好的方式可以及时给我留言。
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签：  html 算法 网盘 返息千一
相关文章推荐
新的分享
章节导航