查看“︁Temp”︁的源代码

<div id="bazi-app-container">
    <style>
        .bz-box {
            background: #ffffff;
            border: 2px solid #b32424;
            padding: 25px;
            border-radius: 12px;
            max-width: 550px;
            margin: 20px auto;
            font-family: "PingFang SC", "Microsoft YaHei", sans-serif;
            box-shadow: 0 4px 15px rgba(0,0,0,0.1);
        }
        .bz-title {
            text-align: center;
            color: #b32424;
            margin-bottom: 20px;
            font-size: 1.5em;
            border-bottom: 1px dashed #ccc;
            padding-bottom: 10px;
        }
        .bz-row { margin-bottom: 15px; text-align: center; }
        .bz-input {
            border: 1px solid #aaa;
            padding: 6px;
            border-radius: 4px;
            width: 60px;
            margin: 0 5px;
        }
        .bz-btn {
            background: #b32424;
            color: white;
            border: none;
            padding: 10px 30px;
            border-radius: 20px;
            cursor: pointer;
            font-size: 1em;
            transition: 0.3s;
        }
        .bz-btn:hover { background: #d32f2f; transform: scale(1.05); }
        .bz-table {
            width: 100%;
            margin-top: 25px;
            border-collapse: collapse;
            display: none;
        }
        .bz-table th { background: #fdf2f2; color: #666; font-weight: normal; padding: 10px; border: 1px solid #eee; }
        .bz-table td { 
            padding: 20px 10px; 
            border: 1px solid #eee; 
            text-align: center; 
            font-size: 1.8em; 
            font-weight: bold; 
            color: #333;
        }
        .wuxing-tag { font-size: 0.4em; display: block; color: #888; margin-top: 5px; }
    </style>

    <div class="bz-box">
        <div class="bz-title">☯ 生辰八字在线排盘</div>
        <div class="bz-row">
            <input type="number" id="y" class="bz-input" value="1995"> 年
            <input type="number" id="m" class="bz-input" value="8"> 月
            <input type="number" id="d" class="bz-input" value="15"> 日
            <input type="number" id="h" class="bz-input" value="12"> 时
        </div>
        <div class="bz-row">
            <button class="bz-btn" onclick="runBazi()">立即测算</button>
        </div>

        <table id="resultTable" class="bz-table">
            <tr><th>年柱 (根)</th><th>月柱 (苗)</th><th>日柱 (花)</th><th>时柱 (果)</th></tr>
            <tr>
                <td id="r-year"></td>
                <td id="r-month"></td>
                <td id="r-day"></td>
                <td id="r-hour"></td>
            </tr>
        </table>
    </div>

    <script>
        function runBazi() {
            const year = parseInt(document.getElementById('y').value);
            const month = parseInt(document.getElementById('m').value);
            const day = parseInt(document.getElementById('d').value);
            const hour = parseInt(document.getElementById('h').value);

            const stems = ["甲", "乙", "丙", "丁", "戊", "己", "庚", "辛", "壬", "癸"];
            const branches = ["子", "丑", "寅", "卯", "辰", "巳", "午", "未", "申", "酉", "戌", "亥"];

            // 1. 日柱算法 (JD)
            let py = year, pm = month;
            if (month <= 2) { py--; pm += 12; }
            let b = 2 - Math.floor(py/100) + Math.floor(Math.floor(py/100)/4);
            let jd = Math.floor(365.25*(py+4716)) + Math.floor(30.6001*(pm+1)) + day + b - 1524.5;
            let dayIdx = (jd + 1) % 60;

            // 2. 节气简易计算
            const getTermDay = (y, m) => {
                const base = [0, 6.11, 4.15, 5.56, 5.02, 5.65, 6.14, 7.53, 7.83, 8, 8.43, 7.54, 7.45];
                return Math.floor((y % 100) * 0.2422 + base[m] + (y >= 2000 ? -0.5 : 0)) - Math.floor((y % 100 - 1) / 4);
            };

            // 3. 计算四柱
            let gzYearVal = (month < 2 || (month === 2 && day < getTermDay(year, 2))) ? year - 1 : year;
            let yearIdx = (gzYearVal - 3) % 60;
            if (yearIdx <= 0) yearIdx += 60;

            let monthOrder = (day < getTermDay(year, month)) ? month - 1 : month;
            if (monthOrder < 1) monthOrder = 12;
            let monthGanIdx = (((yearIdx % 10 || 10) % 5) * 2 + monthOrder) % 10 || 10;
            let monthZhiIdx = (monthOrder + 2) % 12 || 12;

            let hourZhiIdx = Math.floor((hour + 1) / 2) % 12 + 1;
            let dayGanIdx = dayIdx % 10 || 10;
            let hourGanIdx = ((dayGanIdx % 5) * 2 + hourZhiIdx - 2) % 10 || 10;

            const formatGZ = (g, z) => stems[g-1] + branches[z-1];

            // 4. 显示
            document.getElementById('r-year').innerHTML = formatGZ(yearIdx % 10 || 10, yearIdx % 12 || 12);
            document.getElementById('r-month').innerHTML = formatGZ(monthGanIdx, monthZhiIdx);
            document.getElementById('r-day').innerHTML = formatGZ(dayGanIdx, dayIdx % 12 || 12);
            document.getElementById('r-hour').innerHTML = formatGZ(hourGanIdx, hourZhiIdx);
            document.getElementById('resultTable').style.display = 'table';
        }
    </script>
</div>