HTML checkbox プログラムで値を設定できない

 HTMLのcheckbox

<input type="checkbox" id="foo" checked>

これを、プログラムで、値を設定しようとして、できませんでした。

const elements = document.getElementsById("foo");

elements.checked = false;

このような感じで、true、falseを設定すれば、通常は、チェックのオン、オフができます。

しかし、Promise内で、非同期で行ったところ、表示は変わりませんでした。内部で保持されている値は変更されるので、formで、データを送ると、変更は反映されています。

どうやら、表示だけ変わらないようです。

どの言語？か忘れましたが、画面を構成するパーツについて操作するときは、画面操作のスレッドで行わなければならなかったように思います。

Javascriptのことだっけ？と、調べてみましたが、その情報は見つかりませんでした。

内部データが、表示に反映されていないようでしたので、refresh的な、メソッドがないか調べてみましたが見つかりません。

そもそも、checkedの属性は、初期設定に使うもので、後から、プログラムで変更するのは良くない処理なのかもしれません。

属性、プロパティも調べましたが、結局、あきらめました。

プログラムで変える方法があるとすれば、create系で、DOM構造を構築すれば良いかもしれないと考えています。

今回の解決策は、サーバー側で、check状態を設定します。