table.css
table {
font-family:verdana, arial, sans-sarif;
font-size:13px;
color:#333;
border:1px solid #999;
border-collapse:collapse;
100%;
}
th {
background-color:#c3dde0;
border:1px solid #a9c6c9;
padding:8px;
}
tr {
background-color:#d4e3e5;
border:1px solid #a9c6c9;
padding:8px;
}
tr:gt(0):hover {
background:#ff6;
}
td {
border:1px solid #a9c6c9;
padding:8px;
}
calcultor.html
<HTML>
<HEAD>
<TITLE>个人所得税计算器</TITLE>
<META charset="UTF-8"/>
<link rel="stylesheet" href="table.css"/>
<STYLE>
table {
margin:0 auto;
300px;
}
input {
100px;
}
</STYLE>
</HEAD>
<BODY>
<table cellspacing="0">
<tr>
<td colspan="2">个人所得税计算器</td>
</tr>
<tr>
<td>税前工资</td>
<td><input id="money" type="number"><button onclick="cal()">计算<tton></td>
</tr>
<tr>
<td>税率</td>
<td>各阶段所扣税额</td>
</tr>
<tr>
<td>3%</td>
<td ></td>
</tr>
<tr>
<td >10%</td>
<td ></td>
</tr>
<tr>
<td>20%</td>
<td ></td>
</tr>
<tr>
<td>25%</td>
<td ></td>
</tr>
<tr>
<td>30%</td>
<td></td>
</tr>
<tr>
<td>35%</td>
<td ></td>
</tr>
<tr>
<td>45%</td>
<td ></td>
</tr>
<tr>
<td>个税总计</td>
<td ></td>
</tr>
<tr>
<td>个人净得</td>
<td ></td>
</tr>
</BODY>
<SCRIPT src="util.js"> </SCRIPT>
<SCRIPT>
var tds=$('td');
function fn(){
tds[6].innerHTML='';
tds[8].innerHTML='';
tds[10].innerHTML='';
tds[12].innerHTML='';
tds[14].innerHTML='';
tds[16].innerHTML='';
tds[18].innerHTML='';
tds[20].innerHTML='';
tds[22].innerHTML='';
}
function cal(){
var screen =tds[0];
var c=document.getElementById("money");
fn();
var sal=c.value-3500;
if(sal<=0){
tds[20].innerHTML=0;
tds[22].innerHTML=c.value;
}
else if(sal<1500){
tds[6].innerHTML=sal*0.03;
tds[20].innerHTML=sal*0.03;
tds[22].innerHTML=sal-sal*0.03+3500;
}else if(sal<=4500){
tds[6].innerHTML=45;
tds[8].innerHTML=(sal-1500)*0.1;
tds[20].innerHTML=45+(sal-1500)*0.1;
tds[22].innerHTML=sal-(45+(sal-1500)*0.1)+3500;
}else if(sal<=9000){
tds[6].innerHTML=45;
tds[8].innerHTML=300;
tds[10].innerHTML=(sal-4500)*0.2;
tds[20].innerHTML=345+(sal-4500)*0.2;
tds[22].innerHTML=sal-(345+(sal-4500)*0.2)+3500;
}else if(sal<=35000){
tds[6].innerHTML=45;
tds[8].innerHTML=300;
tds[10].innerHTML=900;
tds[12].innerHTML=(sal-9000)*0.25;
tds[20].innerHTML=1245+(sal-9000)*0.25;
tds[22].innerHTML=sal-(1245+(sal-9000)*0.25)+3500;
}else if(sal<=55000){
tds[6].innerHTML=45;
tds[8].innerHTML=300;
tds[10].innerHTML=900;
tds[12].innerHTML=6500;
tds[14].innerHTML=(sal-35000)*0.3;
tds[20].innerHTML=7745+(sal-35000)*0.3;
tds[22].innerHTML=sal-(7745+(sal-35000)*0.3)+3500;
}else if(c.value<=80000){
tds[6].innerHTML=45;
tds[8].innerHTML=300;
tds[10].innerHTML=900;
tds[12].innerHTML=6500;
tds[14].innerHTML=6000;
tds[16].innerHTML=(sal-55000)*0.35;
tds[20].innerHTML=13745+(sal-55000)*0.35;
tds[22].innerHTML=sal-(13745+(sal-55000)*0.35)+3500;
}else{
tds[6].innerHTML=45;
tds[8].innerHTML=300;
tds[10].innerHTML=900;
tds[12].innerHTML=6500;
tds[14].innerHTML=6000;
tds[16].innerHTML=8750;
tds[18].innerHTML=(sal-80000)*0.45;
tds[20].innerHTML=22495+(sal-80000)*0.45;
tds[22].innerHTML=sal-(22495+(sal-80000)*0.45)+3500;
}
}
</SCRIPT>
</HTML>
<!DOCTYPE html>
<HTML>
<HEAD>
<TITLE>个人所得税计算器</TITLE>
<META charset="UTF-8"/>
<link rel="stylesheet" href="table.css"/>
<STYLE>
table {
margin:0 auto;
300px;
}
input {
100px;
}
</STYLE>
</HEAD>
<BODY>
<table cellspacing="0">
<tr>
<td colspan="2">个人所得税计算器</td>
</tr>
<tr>
<td>税前工资</td>
<td><input id="money" type="number"><button onclick="cal()">计算<tton></td>
</tr>
<tr>
<td>税率</td>
<td>各阶段所扣税额</td>
</tr>
<tr>
<td>3%</td>
<td ></td>
</tr>
<tr>
<td >10%</td>
<td ></td>
</tr>
<tr>
<td>20%</td>
<td ></td>
</tr>
<tr>
<td>25%</td>
<td ></td>
</tr>
<tr>
<td>30%</td>
<td></td>
</tr>
<tr>
<td>35%</td>
<td ></td>
</tr>
<tr>
<td>45%</td>
<td ></td>
</tr>
<tr>
<td>个税总计</td>
<td ></td>
</tr>
<tr>
<td>个人净得</td>
<td ></td>
</tr>
</BODY>
<SCRIPT src="util.js"> </SCRIPT>
<SCRIPT>
var tds=$('td');
function fn(){
tds[6].innerHTML='';
tds[8].innerHTML='';
tds[10].innerHTML='';
tds[12].innerHTML='';
tds[14].innerHTML='';
tds[16].innerHTML='';
tds[18].innerHTML='';
tds[20].innerHTML='';
tds[22].innerHTML='';
}
function cal(){
var screen =tds[0];
var c=document.getElementById("money");
fn();
var sal=c.value-3500;
if(sal<=0){
tds[20].innerHTML=0;
tds[22].innerHTML=c.value;
}
else if(sal<1500){
tds[6].innerHTML=sal*0.03;
tds[20].innerHTML=sal*0.03;
tds[22].innerHTML=sal-sal*0.03+3500;
}else if(sal<=4500){
tds[6].innerHTML=45;
tds[8].innerHTML=(sal-1500)*0.1;
tds[20].innerHTML=45+(sal-1500)*0.1;
tds[22].innerHTML=sal-(45+(sal-1500)*0.1)+3500;
}else if(sal<=9000){
tds[6].innerHTML=45;
tds[8].innerHTML=300;
tds[10].innerHTML=(sal-4500)*0.2;
tds[20].innerHTML=345+(sal-4500)*0.2;
tds[22].innerHTML=sal-(345+(sal-4500)*0.2)+3500;
}else if(sal<=35000){
tds[6].innerHTML=45;
tds[8].innerHTML=300;
tds[10].innerHTML=900;
tds[12].innerHTML=(sal-9000)*0.25;
tds[20].innerHTML=1245+(sal-9000)*0.25;
tds[22].innerHTML=sal-(1245+(sal-9000)*0.25)+3500;
}else if(sal<=55000){
tds[6].innerHTML=45;
tds[8].innerHTML=300;
tds[10].innerHTML=900;
tds[12].innerHTML=6500;
tds[14].innerHTML=(sal-35000)*0.3;
tds[20].innerHTML=7745+(sal-35000)*0.3;
tds[22].innerHTML=sal-(7745+(sal-35000)*0.3)+3500;
}else if(c.value<=80000){
tds[6].innerHTML=45;
tds[8].innerHTML=300;
tds[10].innerHTML=900;
tds[12].innerHTML=6500;
tds[14].innerHTML=6000;
tds[16].innerHTML=(sal-55000)*0.35;
tds[20].innerHTML=13745+(sal-55000)*0.35;
tds[22].innerHTML=sal-(13745+(sal-55000)*0.35)+3500;
}else{
tds[6].innerHTML=45;
tds[8].innerHTML=300;
tds[10].innerHTML=900;
tds[12].innerHTML=6500;
tds[14].innerHTML=6000;
tds[16].innerHTML=8750;
tds[18].innerHTML=(sal-80000)*0.45;
tds[20].innerHTML=22495+(sal-80000)*0.45;
tds[22].innerHTML=sal-(22495+(sal-80000)*0.45)+3500;
}
}
</SCRIPT>
</HTML>