任意进制 数值 权展开式 西格玛 web html 源码

这是一段html代码 用于理解 数值权展开式的
任意进制 数值 权展开式 西格玛 web html 源码_第1张图片

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>任意进制 数值 权展开式</title>
</head>
<body>
<div style="width: 100%;text-align: center;margin-top: 20rem;">
    <select name="" id="hex">
        <option value="10">十进制</option>
        <option value="16">十六进制</option>
        <option value="2" selected>二进制</option>
    </select>
    <input type="text" placeholder="数值" id="num">
    <button onclick="weight_click()">点击展开权</button>
    <table>
        <thead>
        <tr>
            <th>位数</th>
            <th>数值</th>
            <th>数权</th>
            <th>数值 * 数权</th>
        </tr>
        </thead>
        <tbody id="tbody">

        </tbody>
        <tr>
        </tr>
    </table>
</div>

<style>
    html,body{
        width: 100%;
        height: 100%;
    }
    body{
        display: flex;
        justify-content: center;
        align-content: center;
    }
    table{
        width: 50%;
        margin: auto;
    }
    tr,td,th{
        border: 1px #eee solid;
        padding: 0;
        box-sizing: border-box;
        text-align: center;
    }
</style>
<script>
    function weight_click(){
        let hexDom = document.getElementById('hex');
        let hex = hexDom.options[hexDom.selectedIndex].value;
        let val = document.getElementById('num').value;
        weight(hex, val);
    }
    function weight(hex, num){
        let temp = num.toString();
        temp = temp.split('.');
        let integer = temp[0].split('').reverse();
        let decimal = temp[1];
        let max_num = integer.length;
        let min_num = 0;
        if (decimal !== undefined) {
            decimal = decimal.split('').reverse()
            min_num = -decimal.length;
        }
        let res = [];
        for (let i = min_num; i < max_num; i++) {
            let val;
            if (i < 0) {
                val = decimal[Math.abs(i) - 1];
                res[i + Math.abs(min_num)] = {
                    math: `${val} * ${hex} ^ -${Math.abs(i)}`,
                    weight: ` ${hex} ^ -${Math.abs(i)}`,
                    number: val,
                    index: -Math.abs(i)
                }
                // res[i + decimal.length] = `Math.pow(${decimal[Math.abs(i) - 1]}, -${Math.abs(i)})`;
            }else{
                val = integer[i];
                res[i + Math.abs(min_num)] = {
                    math: `${val} * ${hex} ^ ${i}`,
                    weight: `${hex} ^ ${i}`,
                    number: val,
                    index: i
                }
                // res[i + decimal.length] = `Math.pow(${integer[i]},  ${i})`;
            }
        }
        let html = [];
        res.forEach(item => {
            html.push("")
            html.push(`<td>${item.index}</td>`)
            html.push(`<td>${item.number}</td>`)
            html.push(`<td>${item.weight}</td>`)
            html.push(`<td>${item.math}</td>`)
            html.push("")
        })
        document.getElementById('tbody').innerHTML = html.join('');
    }
    weight(10, 341.12 );

</script>
</body>
</html>

你可能感兴趣的:(微型计算机原理和接口技术,css3,html5,html)