ボタンをクリックする都度、ボタンの色を変える実習

２０２３／０２／２３（木曜日）　曇りのち晴れ

マイコン（ＥＳＰ３２）に気温、気圧、湿度を測るセンサー（ＢＭＥ２８０）を取り付けて
気象状況を観察するシステム？を作ろうと思って工作をしています。

センサーが計測したデータはパソコンのＷｅｂ画面に表示します。
Ｗｅｂ画面に画像に文字などを表示するのにはＨＴＭＬを使用します。
以前、画面に表示されたカウンターをボタンをクリックすることで増減させるＨＴＭＬを
作ったことがありますが、諸先輩方の資料を参考にしながら見様見真似で作ったので
その仕組みは良く理解できていませんでした。
そこで今回はＨＴＭＬのことを少しでも理解できるようにと、実習しています。

Ｗｅｂのサーバーとクライアントの間ではクライアントの「リクエスト」に対して
サーバーがクライアントの要求を処理して結果を「レスポンス」で回答するという方式で、
やりとりしています。（ということらしい・・・なるほど。）

クライアントが「これをやってね」というリクエストを出すきっかけは画面上に表示された
「選択項目」をマウス・ボタンでクリックするというのが普通でしょう。
今回も「更新」というボタンをクリックするとサーバーはセンサーから気温などのデータを
読みだしてクライアントに答えるようにします。

ボタンをクリックしたらボタンが「凹んで」押された状態になるようにしてみたいのですが
どうしたらいいかわかりません。
そこで単純にボタンの「色」が変わるようにしてみました。
これはボタンの色を指定しているＨＴＭＬのデータを変更すればいいのでなとかなりそうです。

ところがやってみると難しかった・・・あれこれ試行錯誤を繰り返してやっとできました。

その実験の様子を動画でご覧ください。

 

 

さぁー、次は時計の計数をなるべく正確にできるようにしなくては・・・
以前工作した時計では基準の１秒を単純な方法で作ったので、他の処理にかかった
時間の影響をもろに受けて誤差が大きかったです。
これも難しそう・・・でも頑張ります。　応援をよろしくお願いします。