javascript - javascript doesn't set the value of td tag

Question

I'm very new to JavaScript and I wish I could set the value of a td tag using JavaScript.

I have code like this to do so:

window.onload = function() {
     document.getElementById("units").value = "122"
}

And I have a html file like this:

<table class="table" width="100%">
    <caption class="bold">TNEB UnitCalculator</caption>
    <tbody>
        <tr>
            <td>testing</td>
            <td id="units"></td>
        </tr>
    </tbody>
</table>

But that doesn't seems to be working!

Answer 1

タグにはtd値属性がありません：

document.getElementById("units").appendChild(document.createTextNode(122));

または、属性を設定する場合：

document.getElementById("units").setAttribute('data-value', 122);

Answer 2

実際にあなたのコードは正しく動作しています

<script>
    window.onload = function() {
        document.getElementById("units").value = "122"
    }
</script>

<table class="table" width="100%">
    <caption class="bold">TNEB UnitCalculator</caption>
    <tbody>
        <tr>
            <td>testing</td>
            <td id="units"></td>
        </tr>
    </tbody>
</table>

これは、ブラウザの開発者ツールで確認できます。コマンド ラインで、次のように入力します。

document.getElementById("units").value

Answer 3

要素に属性tdがありません。代わりにvalue使用してください。innerHTML