背景介绍
JavaScript 可以帮助开发者实现许多非常实用的功能。本次将通过 JavaScript 封装函数来实现一个简易的个人所得税计算器。
打开环境右侧的【Web 服务】，效果如下：
需要注意这是一个功能不完整的简单个人所得税计算器。
考试需求
基于挑战提供的基础代码，完善个人所得税计算器结构，实现当用户在文本框中输入薪资后，单击计算按钮，即可将计算后的结果显示到页面中。
例如：
当输入 5000，根据个人所得税规则无需缴税，页面效果如下：
当输入 8000，根据个人所得税规则，税率为 3%。首先扣除无需缴纳的个人所得税额 5000 元后，再就剩下的金额根据税率 3%，计算个人所得税，页面效果如下：
当输入 10000，根据个人所得税规则，税率为 5%。首先扣除无需缴纳的个人所得税额 5000 元后，再就剩下的金额根据税率 5%，计算个人所得税，页面效果如下：
html代码：
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>个人所得税计算器</title>
<link rel="stylesheet" href="bootstrap.min.css" type="text/css" />
</head>
<body>
<div class="container">
<h3>个人所得税计算器</h3>
<div>
<h5>规则</h5>
<ol>
<li>薪资小于等于5000元，则无需缴税</li>
<li>薪资大于5000元且小于等于9000，税率为3%</li>
<li>薪资大于9000元且小于等于15000，税率为5%</li>
<li>薪资大于15000，税率为10%</li>
</ol>
</div>
<input type="number" required class="form-control" style="width: 50%;" id="salary" placeholder="请输入您的工资">
<button type="submit" class="btn btn-primary" id="btnsubmit">计算</button>
<p>您需要缴税<span id="val">0</span>元</p>
</div>
</body>
<script type="text/javascript" src="index.js"></script>
<script>
document.getElementById("btnsubmit").onclick = function() {
var salary = document.getElementById("salary").value; //薪资
if (salary <= 0) {
alert("薪资不能为0或小于0");
return false;
}
var result = cal(parseInt(salary));
document.getElementById("val").innerText = result;
};
</script>
</html>需要补充的js代码
function cal(salary) {
// TODO: 在此处补充代码
var m;
if(salary<=5000){
m=0;
}else if(salary>5000&&salary<=9000){
m=(salary-5000)*0.03;
}else if(salary>9000&&salary<=15000){
m=(salary-5000)*0.05;
}else{
m=(salary-5000)*0.1;
}
return m;
}
module.exports = cal; //请勿删除文章出处登录后可见！
已经登录？立即刷新
