フォームのデータを設定する - JavaScriptのチュートリアル

このレッスンでは、 フォーム要素にデータを設定してみます。 今開いているJavaScriptコードは、 フォーム要素のデータを取得して それをコンソールに出力するという形に なっています。 簡単に確認すると、 フォームには form という名前があるので document.forms から form の名前で フォーム要素を取得しています。 更にそのフォーム要素に 名前、button ですね、 name でボタン要素を取得したら、 addEventListener、click で 値を取得する関数を呼び出しています。 そして、form の0というのは 名前が text、 name=text になってますから、 .text でもいいんですが、 このようにインデックスでも 取得ができます。 そして value を参照すると、 このテキストですね。 次、2番目は、 radio とタイトルがついていますが、 name はやはり radio になってますね。 それを角括弧で参照することもできます。 もちろんここは書き換えちゃいましょうか。 .name の方が簡単ですね。 角括弧で参照する方が 便利なこともあるんですが、 ここは「.」の方が簡単ですね。 ではついでに、この [0] も テキストに書き換えましょう。 .text と、同じことです。 そして radio の value というのは checked、ラジオボタン1個 選択できますから、 この選択されている value、1 ですね、 これが取得できます。 次は checkbox。 checkbox だけはちょっと例外で、 名前は checkA、checkB、 別々にしたかったので、 type は checkbox なんですけれども checkA、checkB ということに なっています。 そこで、form に対して .name の checkA で checked。 チェックがついてるかどうかというと、 checked の属性があるので チェックがついています。 ですから、true という値が 返ってくるはずですね。 今度は select の方は やはり name は select で、 特に設定をしていないと 一番先頭が選ばれます。 ですから、値を取得すると value を取得すると、この先頭の位置が…