ちょっとした気づき

こんなに悩んでたのに、こんなことで解決しちゃったのシリーズです。

コードを書いてて気づいたことを忘れないようにメモしていこうと思います。内容的にだいぶ初歩的かもしれませんが。

inputタグのchecked

inputタグのtype属性のcheckedについてです。

タブメニューを作る際、どれか一つのタブが選択されている状態を作りますよね。検索して出てきたコードを参考に作っていましたが、途中からタブの数減らしたいなと思って一番上のinputタグを消したのが問題でした。サイトをリロードするとタブの項目しか表示されていなかったんです。

見た目悪いな、解決したいと思いつつcss一単語で解決できると思ってなかった。JavaScript必要かなとか、結局後回しにしてましたがやっと気づくことができました。

検索してどう書いてあるか見ればいいんじゃんと。

結局原因として一番上のinputタグを消したことで、一番上のinputタグの後ろに書くcheckedが抜けていたせいで初期値が設定されていなかったんですね。

inputタグのtype属性のcheckedは初期値を設定するもの。

消したことで一つ学んだのと、こんなことに時間かかってたのかと思う気持ちと、、まだまだ知らないことがたくさんあるなと思いました。