console 命令行工具 X clear

console

/* plem.cn */
const table = document.querySelector("table>tbody");
document.querySelector("#repay").addEventListener("click", function (e) {
    //console.log(e.target);
    var data = ["total", "type", "year", "rate"];
    for (var i in data) {
        var d = data[i];
        this.setAttribute('data-' + d, document.querySelector("#" + d).value);
    }
    table.innerHTML = tbody(this);
});

function tbody(_this) {
    this._total = 0;
    var total = _this.getAttribute('data-total') * 10000;
    var month = _this.getAttribute('data-year') * 12;
    var rate = _this.getAttribute('data-rate') / 1200;
    var fn = eval("this.repay_b" + _this.getAttribute('data-type'));
    var items = new Array();
    for (var i = 1; i <= month; i++) {
        items.push(fn.apply(this, [total, month, rate, i]));
    }

    return items.map(tr => {
        var td = tr.map(td => `<td>${td}</td>`).join('');
        return `<tr>${td}</tr>`
    }).join('');
}

function repay_bj(t, m, r, p) {
    let capital = t / m;
    let interest = (t - capital * (p - 1)) * r;
    let payment = capital + interest;
    let balance = t * (1 - p / m);
    this._total += interest;
    return new Array(p, payment.toFixed(2), capital.toFixed(2), this._total.toFixed(2), balance.toFixed(2));
}

function repay_bx(t, m, r, p) {
    let payment = t * r * Math.pow(1 + r, m) / (Math.pow(1 + r, m) - 1);
    let capital = t * r * Math.pow(1 + r, p - 1) / (Math.pow(1 + r, m) - 1);
    let balance = t * (Math.pow(1 + r, m) - Math.pow(1 + r, p - 1)) / (Math.pow(1 + r, m) - 1) - capital;
    let interest = payment - capital + this._total;
    this._total = interest;
    return new Array(p, payment.toFixed(2), capital.toFixed(2), interest.toFixed(2), balance.toFixed(2));
}

<!DOCTYPE html>
<html>

<head lang="en">
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width">
	<title>贷款计算器plem.cn</title>
</head>

<body>
	<select id="type"><option value="j">本金</option><option value="x">本息</option></select>
    <button id="repay"> 计算 </button><br />
    <input id="total" value="150" placeholder="总额，单位万，如150" />
    <input id="year"   value="30" placeholder="期限，单位年，如30" />
    <input id="rate" value="5.85" placeholder="年化率，如5.85" />
    <table>
        <thead>
            <tr>
                <th>期数</th>
                <th>每月还款额</th>
                <th>本金</th>
                <th>累计利息</th>
                <th>剩余贷款额</th>
            </tr>
        </thead>
    <tbody></tbody>
    </table>
    <a href="https://beian.miit.gov.cn/" target="_blank" style="position: fixed;bottom: 0;">粤ICP备20012318号 @plem.cn</a>

</body>
</html>

/**http://plem.cn/loan.html**/

input {
    width: 80%
}

a {
    position: fixed;
    bottom: 0;
    text-decoration: none;
}

table tbody {
    display: block;
    height: 450px;
    overflow-y: scroll
}

table thead,
tbody tr {
    display: table;
    width: 100%;
    table-layout: fixed;
}

table head {
    width: calc( 100% - 1.1em)
}

td,th{
    text-align: center
}