Question

我在Chrome上尝试运行时遇到此错误。我尝试了一切，但我检查了并声明了变量。我不知道出了什么问题。任何帮助都会很棒。提前谢谢。

源代码如下：

<!DOCTYPE html>
<html>
<head>
    <title>Difference Engine</title>
    <style>
        table td, th{border: 1.5px solid black;}
        table th{background-color: lightgrey; padding: 5px;}
    </style>
    <script>
    var X,Y,dY,d2Y,d3Y,d4Y,d5y,bX,bY,bdY,bd2Y,bd3Y,bd3Y,bd4Y,bd5Y;
        X=0,
        Y=0,
        dY=0,
        d2Y=0,
        d3Y=0,
        d4Y=0,
        d5y=0,
        bX=document.getElementById('rX');
        bY=document.getElementById('rY');
        bdY=document.getElementById('rdY');
        bd2Y=document.getElementById('rd2Y');
        bd3Y=document.getElementById('rd3Y');
        bd4Y=document.getElementById('rd4Y');
        bd5Y=document.getElementById('rd5Y');

    function sum() {
        X=Number(document.getElementById('X').value)+1;
        Y=Number(document.getElementById('Y').value);
        dY=Number(document.getElementById('dY').value);
        d2Y=Number(document.getElementById('d2Y').value);
        d3Y=Number(document.getElementById('d3Y').value);
        d4Y=Number(document.getElementById('d4Y').value);
        d5Y=Number(document.getElementById('d5Y').value);

        for (X; X < Number(document.getElementById('numRows').value); X++) {
            Y+=dY;
            dY+=d2Y;
            d2Y+=d3Y;
            d3Y+=d4Y;
            d4Y+=d5Y;

            bX.value=X+"\n";
            bY.value=Y+"\n";
            bdY.value=dY+"\n";
            bd2Y.value=d2Y+"\n";
            bd3Y.value=d3Y+"\n";
            bd4Y.value=d4Y+"\n";
            bd5Y.value=d5Y+"\n";
        }
    }
    function reset(){

    }
    </script>
</head>
<body bgcolor="#F5DEB3">
<center>
    <h1>The Babbage Difference Engine Simulator</h1>
    <h3>This is a simulation for the DIfference Engine first proposed by Charles Babbage</h3>
    Rows: <input type="number" id="numRows">
    <button id="run" onclick="sum()">Run</button>
    <button id="reset" onclick="reset()">Reset</button>
    <br>
    <table>
    <tr>
        <th>X</th>
        <th>Y</th>
        <th>&Delta;Y</th>
        <th>&Delta;<sup>2</sup>Y</th>
        <th>&Delta;<sup>3</sup>Y</th>
        <th>&Delta;<sup>4</sup>Y</th>
        <th>&Delta;<sup>5</sup>Y</th>
    </tr>
    <br>
    <tr>
        <th><input type="number" id="X" /></th>
        <th><input type="number" id="Y" /></th>
        <th><input type="number" id="dY" /></th>
        <th><input type="number" id="d2Y" /></th>
        <th><input type="number" id="d3Y" /></th>
        <th><input type="number" id="d4Y" /></th>
        <th><input type="number" id="d5Y" /></th>
    </tr>
    <tr>
        <td><textarea id="rX" rows="35" cols="23"></textarea></td>
        <td><textarea id="rY" rows="35" cols="23"></textarea></td>
        <td><textarea id="rdY" rows="35" cols="23"></textarea></td>
        <td><textarea id="rd2Y" rows="35" cols="23"></textarea></td>
        <td><textarea id="rd3Y" rows="35" cols="23"></textarea></td>
        <td><textarea id="rd4Y" rows="35" cols="23"></textarea></td>
        <td><textarea id="rd5Y" rows="35" cols="23"></textarea></td>
    </tr>
    </tbody>
    </table>
</center>
</body>
</html>

Answer 1

在DOM有机会创建您要操作的元素之前，您正在运行脚本。在你的身体完成后移动脚本。

＆＃13;

<!DOCTYPE html>
<html>
<head>
    <title>Difference Engine</title>
    <style>
        table td, th{border: 1.5px solid black;}
        table th{background-color: lightgrey; padding: 5px;}
    </style>
    
</head>
<body bgcolor="#F5DEB3">
<center>
    <h1>The Babbage Difference Engine Simulator</h1>
    <h3>This is a simulation for the DIfference Engine first proposed by Charles Babbage</h3>
    Rows: <input type="number" id="numRows">
    <button id="run" onclick="sum()">Run</button>
    <button id="reset" onclick="reset()">Reset</button>
    <br>
    <table>
    <tr>
        <th>X</th>
        <th>Y</th>
        <th>&Delta;Y</th>
        <th>&Delta;<sup>2</sup>Y</th>
        <th>&Delta;<sup>3</sup>Y</th>
        <th>&Delta;<sup>4</sup>Y</th>
        <th>&Delta;<sup>5</sup>Y</th>
    </tr>
    <br>
    <tr>
        <th><input type="number" id="X" /></th>
        <th><input type="number" id="Y" /></th>
        <th><input type="number" id="dY" /></th>
        <th><input type="number" id="d2Y" /></th>
        <th><input type="number" id="d3Y" /></th>
        <th><input type="number" id="d4Y" /></th>
        <th><input type="number" id="d5Y" /></th>
    </tr>
    <tr>
        <td><textarea id="rX" rows="35" cols="23"></textarea></td>
        <td><textarea id="rY" rows="35" cols="23"></textarea></td>
        <td><textarea id="rdY" rows="35" cols="23"></textarea></td>
        <td><textarea id="rd2Y" rows="35" cols="23"></textarea></td>
        <td><textarea id="rd3Y" rows="35" cols="23"></textarea></td>
        <td><textarea id="rd4Y" rows="35" cols="23"></textarea></td>
        <td><textarea id="rd5Y" rows="35" cols="23"></textarea></td>
    </tr>
    </tbody>
    </table>
</center>
</body>
<script>
    var X,Y,dY,d2Y,d3Y,d4Y,d5y,bX,bY,bdY,bd2Y,bd3Y,bd3Y,bd4Y,bd5Y;
        X=0,
        Y=0,
        dY=0,
        d2Y=0,
        d3Y=0,
        d4Y=0,
        d5y=0,
        bX=document.getElementById('rX');
        bY=document.getElementById('rY');
        bdY=document.getElementById('rdY');
        bd2Y=document.getElementById('rd2Y');
        bd3Y=document.getElementById('rd3Y');
        bd4Y=document.getElementById('rd4Y');
        bd5Y=document.getElementById('rd5Y');

    function sum() {
        X=Number(document.getElementById('X').value)+1;
        Y=Number(document.getElementById('Y').value);
        dY=Number(document.getElementById('dY').value);
        d2Y=Number(document.getElementById('d2Y').value);
        d3Y=Number(document.getElementById('d3Y').value);
        d4Y=Number(document.getElementById('d4Y').value);
        d5Y=Number(document.getElementById('d5Y').value);

        for (X; X < Number(document.getElementById('numRows').value); X++) {
            Y+=dY;
            dY+=d2Y;
            d2Y+=d3Y;
            d3Y+=d4Y;
            d4Y+=d5Y;

            bX.value=X+"\n";
            bY.value=Y+"\n";
            bdY.value=dY+"\n";
            bd2Y.value=d2Y+"\n";
            bd3Y.value=d3Y+"\n";
            bd4Y.value=d4Y+"\n";
            bd5Y.value=d5Y+"\n";
        }
    }
    function reset(){

    }
    </script>
</html>

＆＃13;

JS错误：未捕获的TypeError：无法设置null的属性“value”

1 个答案: