HTML

HTMLでvalue属性を使って入力初期値を指定する方法を現役エンジニアが解説【初心者向け】

初心者向けにvalue属性を使ってHTML内の入力初期値を指定する方法について解説しています。value属性はフォームから入力されたデータを扱う際に必要となるものです。代表的な使い方と初期値の設定の例を確認しましょう。

テックアカデミーマガジンは受講者数No.1のプログラミングスクール「テックアカデミー」が運営。初心者向けにプロが解説した記事を公開中。現役エンジニアの方はこちらをご覧ください。 ※ アンケートモニター提供元：GMOリサーチ株式会社　調査期間：2021年8月12日～8月16日　調査対象：2020年8月以降にプログラミングスクールを受講した18～80歳の男女1,000名　調査手法：インターネット調査

監修してくれたメンター

ノマリカ

印刷会社で校閲とDTPオペレーションを5年、Web制作会社でデザイナーを8年、一般企業でWeb担当を1年経験した後、フリーランスのデザイナーとして独立。
伝わりやすくて明快なデザインを得意としている。

value属性を使ってHTML内の入力初期値を指定する方法について、テックアカデミーのメンター（現役エンジニア）が実際のコードを使用して初心者向けに解説します。

value属性とは

value（バリュー）属性は、主にinputタグなどの入力フィールドの初期値を設定できます。

ユーザーによる入力があった場合は、value属性に設定されていた初期値が入力された内容に変更され、サーバへ送信されます。

初期値はあらかじめ表示させておく入力例と混同されやすいのですが、入力例の場合はvalue属性ではなくplaceholder属性を利用しましょう。

value属性が使えるタグ

input
button
option
ol内部のli
progress
meter
data

inputタグでは、入力フォームからサーバへ送信する初期値を指定できます。

buttonタグやoptionタグでは、実際に送信する値を表示させる内容とは違う値にしたい場合に、value属性で指定できます。

olタグ内のli（番号付きリスト）では、各リストの番号を設定できます。

次項では、value属性で初期値を指定する代表的な方法を紹介していきます。

[PR] Webデザインで副業する学習方法を動画で公開中

value属性で初期値を指定する方法

主にinputタグのvalue属性において、初期値を指定する方法を紹介します。

基本的なテキスト入力欄の例

See the Pen
Untitled by nomallica (@nomallica)
on CodePen.

※実際にWebアプリケーションと連動させて実用するためには、formタグへのactionやmethod属性の設定、その他送信機能の実装も必要になります。

なお、下記のように初期値を空に指定することも可能です。

初期値を空に指定した例

See the Pen
初期値を空の状態の例 by nomallica (@nomallica)
on CodePen.

以下は、olタグのli（番号付きリスト）の各リスト番号を任意の数字に設定した例です。

リスト番号をvalue属性で設定した例

See the Pen
リスト番号をvalue属性で設定した例 by nomallica (@nomallica)
on CodePen.

まとめ

今回はHTMLでvalue属性を使って初期値を指定する方法について解説しました。

入力フォームからサーバのアプリケーションなどにデータが送信される際には、表示されている内容ではなくvalue属性に設定されている値が送信されます。

入力が必須でない項目など、初期値をあらかじめ設定しておくことで入力する側の負担軽減にもつながりますので、ぜひ覚えておきましょう。

value属性を使ってHTML内の入力初期値を指定する方法がよくわかりました！

ゆかりちゃんも分からないことがあったら質問してね！

分かりました。ありがとうございます！

HTMLを学習中の方へ

これで解説は終了です、お疲れさまでした。

つまずかず「効率的に」学びたい
副業や転職後の「現場で使える」知識やスキルを身につけたい

HTMLを学習していて、このように思ったことはありませんか？

テックアカデミーのWebデザインコースでは、第一線で活躍する「プロのWebデザイナー」が教えているので、効率的に実践的なスキルを完全オンラインでしっかり習得できます。

合格率10%の選考を通過した、選ばれたWebデザイナーの手厚いサポートを受けながら、オリジナルのWebサイト制作を学べます。

まずは一度、無料体験で学習の悩みや今後のキャリアについて話してみて、「現役Webデザイナーから教わること」を実感してみてください。

時間がない方、深く知ってから体験してみたい方は、今スグ見られる説明動画から先に視聴することをおすすめします！

HTMLでボタンの余白を調整する方法を現役エンジニアが解説【初心者向け】

HTMLでボタンの余白を調整する方法について、TechAcademyのメンター（現役エンジニア）が実際のコードを使用して初心者向けに解説します。そもそも...

HTML

今すぐ覚えられる！HTMLでJavaScriptを読み込む（呼び出す）方法を現役エンジニアが解説【初心者向け】

HTMLとCSSのみでは動きのあるWebページを作ることは難しいです。例えばプルダウンメニューやスライドインページなどはCSSのみで出来ない訳ではありませんが、...

HTML

HTMLで文字エンコードを指定する方法を現役デザイナーが解説【初心者向け】

HTMLで文字エンコードを指定する方法について、TechAcademyのメンター（現役エンジニア）が実際のコードを使用して初心者向けに解説します。そもそ...

HTML

HTMLで横・縦に並べるレスポンシブデザインを上手に使う方法を現役エンジニアが解説【初心者向け】

HTMLで横・縦に並べるレスポンシブデザインを上手に使う方法について、TechAcademyのメンター（現役エンジニア）が実際のコードを使用して初心者向けに解説...

HTML

HTMLでスクロールバーを表示・非表示する方法を現役エンジニアが解説【初心者向け】

HTMLでスクロールバーを表示・非表示する方法について、テックアカデミーのメンター（現役エンジニア）が実際のコードを使用して初心者向けに解説します。 &n...

HTML

HTMLでid属性が重複した時の動きについて現役デザイナーが解説【初心者向け】

HTMLでid属性が重複した時の動きについて解説します。そもそも、HTMLの記述方法がわからない場合は、 HTMLの書き方の記事を読むとさらに理解が深...

HTML

あわせてよく読まれている記事

HTMLでinputタグのvalue属性に初期値を設定する方法を現役デザイナーが解説【初心者向け】

HTMLでinputタグのvalue属性に初期値を設定する方法について、TechAcademyのメンター（現役エンジニア）が実際のコードを使用して初心者向けに解説します。そもそも、HTMLの記述方法がわからない場合は、 HTMLの書き方について解説した記事を読むとさらに理解が深まります。なお本記事は、TechAcademyのオンラインブートキャンプ、Webデザイン講座のHTMLカリキュラムをもとに執筆しています。田島悠介今回は、HTMLに関する内容だね！大石ゆかりどういう内容でしょうか？田島悠介 inputタグのvalue属性に初期値を設定する方法について詳しく説明していくね！大石ゆかりお願いします！ inputタグとは inputタグとはHTMLの入力部品を表示させるためのタグです。inputタグのtype属性にtextを指定することで、テキストボックスを表示させることができます。以下のコードでテキストボックスが表示できます。 <input type="text"> value属性について HTMLのタグは、いくつかの属性を指定することで、表示形式を変えたり、コントロールすることができます。inputタグは、タグ内にvalue=”xxx”という追加属性を指定することができます。 [PR] Webデザインで副業する学習方法を動画で公開中初期値とはブラウザに画面を表示した時に、既に入力済みの値のことを初期値と呼びます。 value属性に初期値を設定してみようテキストボックスには、初期値をあらかじめ表示させることができます。inputタグにvalue属性を追加して表示させたい内容を指定してみましょう。以下のように指定します。 <input type="text" value="こんにちは"> ブラウザ画面で確認すると、あらかじめ「こんにちは」と入力されたテキストボックスが表示できます。実際のWebサイトでは、ユーザー情報の更新フォームなどで登録済みの入力値（名前など）が初期表示されますが、仕組みはこのようになっています。まとめ inputタグにvalue属性で値を指定することでテキストボックスに初期値を表示させることができます。監修してくれたメンター寺谷文宏 WEBアプリケーションエンジニアとして数多くのプロジェクトを経験し、フロントエンドからサーバーサイドまで総合的な開発を得意としています。 TechAchademyではフロントエンド、Javaコースを担当。大石ゆかり内容分かりやすくて良かったです！田島悠介ゆかりちゃんも分からないことがあったら質問してね！大石ゆかり分かりました。ありがとうございます！ TechAcademyでは初心者でも、オリジナルWebサイトを公開できる、オンラインブートキャンプを開催しています。また、現役エンジニアから学べる無料体験も実施しているので、ぜひ参加してみてください。

HTML

HTMLでラジオボタンとチェックボックスを表示する方法【初心者向け】

HTMLについて今さら聞けない！という初心者のために、HTMLの基礎を紹介する記事です。今回は、ラジオボタンとチェックボックスを表示する方法について、初心者の方にも分かりやすく2人のキャラクターを用いて解説しています。そもそもHTMLの記述方法がわからない場合は、HTMLの書き方について解説した記事を読むとさらに理解が深まります。なお本記事は、TechAcademyのオンラインブートキャンプWebデザイン講座のHTMLカリキュラムをもとに執筆しています。田島悠介今回は、HTMLに関する内容だね！大石ゆかりどういう内容でしょうか？田島悠介ラジオボタンとチェックボックスを表示する方法について詳しく説明していくね！大石ゆかりお願いします！入力フォームの選択ボタン入力フォームでよく見かける選択ボタンに、ラジオボタンとチェックボックスがあります。どちらも<input>タグにtype属性を指定することで簡単につくることができます。 <input>タグについては HTMLのinputタグとtextareaタグを使ってテキスト入力欄を表示する方法をご覧ください。ラジオボタン、チェックボックスは以下のタグで表示することが可能です。・ラジオボタン <input type=”radio”> 選択肢のなかから、ひとつだけを選択するボタン（※同一name属性内で、一項目しか選択できない）・チェックボックス <input type=”checkbox”> 選択肢のなかから、複数選択ができるボタン（※同一name属性はひとまとまりのデータとして扱われる）・value属性選択項目をデータとして送信する際に、データの受けとり手に値を知らせます。・name属性要素（ここでは<input type=”●●”>）に名前をつけて、なんの要素（選択ボタン）であるかを指定します。大石ゆかり typeを使うと他にもいろいろ設定できるんですかー？田島悠介他にも送信ボタンであったり、文字を入力できるフォームも簡単に作れるんだよ！大石ゆかりへぇ〜じゃあアンケートページとかでよく使われてそうですね！それでは具体的な実装方法をみていきましょう。ラジオボタンラジオボタンという名前は、昔の自動車に搭載されていたカーラジオが、ひとつの局のボタンを押すと、他の局のボタンが選択できない仕様だったことから来ているそうです。ラジオボタンは選択肢のなかから、ひとつだけを選択する入力ツールになります。 <input type=”radio”>にname属性を”gender”、valueを”male”と”female”に設定して性別選択ボタンをつくりましょう。タグの終わりには、実際にブラウザで表示される項目名(男性・女性)を書きます。選択肢の値(value)が”male”と”female”の、”gender”という名前(name)がついたラジオボタン（<input type=”radio”>）です。 <input type="radio" name="gender" value="male">男性 <input type="radio" name="gender" value="female">女性これでどちらか一方を選択できるボタンができました。上記のHTMLをコピー&ペーストして、もうひとつラジオボタンをつくってみましょう。ここでは、Webページの訪問者からサイトを知った経緯を知りたいと仮定して、選択肢の値(value)にサイトを知るきっかけとなった項目を設定し、”trigger”という名前のついたラジオボタンをつくります。 <input type="radio" name="trigger" value="facebook">facebook <input type="radio" name="trigger" value="twitter">twitter <input type="radio" name="trigger" value="hatebu">はてなマーク <input type="radio" name="trigger" value="syoukai">知人からの紹介今度は、”gender”と”trigger”の2つの選択ツールができました。このとき、name属性を”trigger”に書き換え忘れて”gender”のままにしておくと、”gender”と名付けられたすべての項目「男性、女性、facebook、twitter、はてなブックマーク、知人からの紹介」から、どれか一つの項目を選択することになってしまいます。複数の選択群をつくる際には、必ずカテゴリーごとにしっかりとname属性を分けるように注意しましょう。 [PR] Webデザインで副業する学習方法を動画で公開中disabled属性 disabled属性は、フォーム部品を無効化することができます。この属性で指定することで、フォーム部品の選択や書き換えを行うことができます。用途の目的としては、同じフォーム流用するが、ユーザーの選択肢によってdisabeld属性を使用し一部の選択肢の書き換えを禁止する時に使用します。 disabled属性の実例 <!DOCTYPE html> <html> <head><meta charset="UTF-8"></head> <body>  <input type="radio" name="gender" value="male" disabled/>男性 <input type="radio" name="gender" value="male"/>女性

HTML

HTMLでoptionタグにselected属性を使い初期値を設定する方法を現役エンジニアが解説【初心者向け】

HTMLでoptionタグにselected属性を使って初期値を設定する方法について解説します。そもそもHTMLの記述方法がわからない場合は、 HTMLの書き方について解説した記事を読むとさらに理解が深まります。目次value属性とはvalue属性が使えるタグvalue属性で初期値を指定する方法まとめHTMLを学習中の方へ田島悠介今回は、HTMLに関する内容だね！大石ゆかりどういう内容でしょうか？田島悠介 optionタグにselected属性を使って初期値を設定する方法について詳しく説明していくね！大石ゆかりお願いします！ selectタグとoptionタグの関係 selectタグとは、セレクトボックスを表示するタグです。 optionタグとは、selectタグ内で使用することで、選択肢の1つを作成可能です。 <select>タグと<option>タグで、入力フォームなどで使用される選択式メニューを設置できます。 <select>タグで項目(フォーム)を作成し、選択する値(選択肢)は<option>タグで作成できます。 2つのタグを活用したHTMLは以下の通りです。 HTML <select name="number"> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> </select> 実行結果 See the Pen select1 by マインクラフトゲームアプリプログラミング学校 (@programjp) on CodePen. 解説ユーザーによって、例えば1を選択する操作がされるとき、次のコードが実行されます。 <select name="number"> <option value="1">1</option> 選択された値は、<select>タグのname属性と<option>タグのvalue属性がセットで送信されます。今回の場合、ユーザーはnumberが1という情報を選択して送信することが可能です。 selected属性で初期値を選択する方法 Webページを読み込んだ際に、下記例のように、<select>タグで作成された選択式メニューの一番上の<option>タグの値が、選択されている状態となります。例：<select>タグで初期の一番上の「1」と「あ」が選択された状態 HTML <select name="number"> <option value="1">1</option> <option value="2">2</option> <option value="3" selected>3</option> <option value="4">4</option> <option value="5">5</option> </select> 解説 selected属性を使用することによって、初期の選択値を自由に設定することが可能です。 selected属性は初期選択値にしたい<option>タグに設定します。今回は次のコードで、3を初期の選択値として設定しています。 <option value="3" selected>3</option> 実装結果 See the Pen select3 by マインクラフトゲームアプリプログラミング学校 (@programjp) on CodePen. [PR] Webデザインで副業する学習方法を動画で公開中optionタグとselected属性を使って選択式メニューを作ってみよう 1〜5、あ〜お、A〜Eから1つ値を選択させるような選択式メニューを作成してみましょう。初期選択値は3、い、Eになるようにします。以下はoptionタグとselected属性を使用したコードの例です。 HTML <select name="number"> <option value="1">1</option> <option value="2">2</option> <option value="3" selected>3</option> <option value="4">4</option>

HTML

PHPで配列のkeyを取得する方法を現役エンジニアが解説【初心者向け】

今回は、PHPで配列のkeyを取得する方法について、テックアカデミーのメンター（現役エンジニア）が実際のコードを使用して初心者向けに解説します。 PHPで配列のkeyを取得することで、配列で使われているkeyを調べることができます。実務でも配列のkeyを利用した値の操作を行いますので、ぜひ学習してみてください。目次value属性とはvalue属性が使えるタグvalue属性で初期値を指定する方法まとめHTMLを学習中の方へそもそもPHPについてよく分からないという方は、PHPとは何なのか解説した記事を読むとさらに理解が深まります。田島悠介今回は、PHPに関する内容だね！大石ゆかりどういう内容でしょうか？田島悠介 PHPで配列のkeyを取得する方法について詳しく説明していくね！大石ゆかりお願いします！この記事では、PHPで配列のkeyを取得する方法について記載しています。まだPHPでの開発に慣れていない方でも理解できる内容です。配列のkeyとvalueについて PHPでは連想配列という配列において、keyとvalueのセットで連想配列にデータを格納します。配列とは、複数の値を入れる箱のようなものです。通常の配列通常の配列においては、添字（インデックス）という数字でデータ(value)の格納場所に番号を振っています。配列サンプルコード <?php $array = ["りんご", "れもん", "もも"]; print_r($array); echo $array[1]; 配列実行結果配列解説 <?phpでは、PHPプログラムを開始しています。 $array = [“りんご”, “れもん”, “もも”];では、$array配列に”りんご”, “れもん”, “もも”を代入しています。 print_r($array);では、$array配列を表示しています。 echo $array[1];では、$array配列の1番目のインデックスで指定した、れもんを表示しています。連想配列連想配列は、添字（インデックス）の代わりにデータ（value）を入れる箱に「key」という任意の名前をつけて管理します。つまり、連想配列ではインデックスではなく、任意の文字列であるkeyを利用してvalueを抽出できます。連想配列サンプルコード <?php $array = ["apple" => "りんご", "lemon" => "れもん", "peach" => "もも"]; print_r($array); echo $array["lemon"]; 連想配列実行結果連想配列解説 <?phpでは、PHPプログラムを開始しています。 $array = [“apple” => “りんご”, “lemon” => “れもん”, “peach” => “もも”];では、$array配列に”apple” => “りんご”, “lemon” => “れもん”, “peach” => “もも”を代入しています。 print_r($array);では、$array配列を表示しています。 echo $array[“lemon”];では、$array配列のkeyであるlemonで指定した、れもんを表示しています。 array_keys関数の使い方 PHPのarray_keys関数は、連想配列の「key」だけを取得する関数です。それでは、array_keys関数の使い方について見ていきましょう。 array_keys関数で「key」だけを抽出する次のように、array_keys関数の引数に連想配列を渡すことで、「key」だけを抽出した配列として返却します。 array_keys($連想配列) array_keys関数で検索するvalueとセットになっているkeyを抽出第1引数に連想配列を渡し、第2引数に連想配列の中のvalueから検索したい値を渡すことで、検索するvalueとセットになっているkeyを抽出し配列にして返却します。第3引数はオプションなので、必須ではありません。第3引数は、boolean型のtrueを渡すことで、第2引数に渡した「検索するvalue」のデータ型まで完全に一致するものを連想配列の中から探します。デフォルトではboolean型のfalseが設定されているので、データ型が完全に一致しなくても検索対象です。 boolean型というのは、trueかfalseの2つの値のどちらかになる型の値です。 array_keys($連想配列, $検索するvalue [, $型チェック = FALSE]) [PR] Webデザインで副業する学習方法を動画で公開中array_keys関数で「key」だけを抽出する方法を実際に書いてみましょうここでは、連想配列のkeyをすべて抽出する方法について見ていきましょう。サンプルコード <?php $array = ["apple" => "りんご", "lemon" =>

PHP

HTMLでドロップダウンメニューを表示する方法【初心者向け】

HTMLについて今さら聞けない！という初心者のために、HTMLの基礎を紹介する記事です。今回は、ドロップダウンメニューを表示する方法についてテックアカデミーのメンター（現役エンジニア）が初心者向けに解説します。目次value属性とはvalue属性が使えるタグvalue属性で初期値を指定する方法まとめHTMLを学習中の方へそもそもHTMLの記述方法がわからない場合は、HTMLの書き方について解説した記事を読むとさらに理解が深まります。田島悠介今回は、HTMLに関する内容だね！大石ゆかりどういう内容でしょうか？田島悠介ドロップダウンメニューを表示する方法について詳しく説明していくね！大石ゆかりお願いします！ドロップダウンメニューとはドロップダウンメニューは、たくさんの選択肢の中からどれかひとつを選ぶタイプのメニューバーです。プルダウンメニューとも呼びます。ラジオボックスやチェックボックスと異なり、たくさんの選択肢がある場合に場所をとらずに表示することができます。 HTMLでは下記のタグを組み合わせて実装します。 <select>タグ <select>タグとは、選択肢の中から選ぶタイプの入力項目を作るタグです。 <select></select> name属性 name属性とは、ドロップダウンメニューの名前を設定する属性です。 name属性に設定した名前は、選択項目をデータとして送信する際に、データの受け取り手が値を取得する際に利用します。 name属性は、以下のように記述します。 <select name="month"></select> multiple属性 multiple属性は、ドロップダウンメニューで複数項目を選択したい場合に設定する属性です。 multiple属性は、以下のように記述します。 <select multiple></select> <option>タグ <option>タグは、ドロップダウンメニューに表示される選択肢を作るタグです。 <option>タグは、以下のように記述します。 <option>いち</option> value属性 value属性は、選択項目をデータとして送信する際に、データの受け取り手に渡す値を設定する属性です。 value属性は、以下のように記述します。 <option value="1">いち</option> <optgroup>タグ <optgroup>タグは、複数の<option>タグをグループ分けするタグです。グループ分けをすることで、メニューをわかりやすく表示できます。 <optgroup>タグは、以下のように記述します。 <optgroup> <option value="tokyo">東京</option> </optgroup> label属性 label属性は、<optgroup>タグでグループ分けした項目のラベルを設定する属性です。 label属性は、以下のように記述します。 <optgroup label="関東"> <option value="tokyo">東京</option> </optgroup> 大石ゆかりドロップダウンメニューもフォームの部品なんですか？田島悠介そうそう。都道府県を選んだり、月を選んだりする場合に向いている項目なんだよ。大石ゆかり複数の中から1つ選ぶ、という感じですね。田島悠介そうだよ。では、実際に書いてみよう！ドロップダウンメニューを実装するそれでは実際にコードの例を見ていきましょう。今回は月を選択するドロップダウンメニューをつくります。 <option>タグで項目を囲み、valueを設定します。 name属性が”month”の<select>タグで<option>を囲みましょう。 <select name="month"> <option value="jan">1月</option> <option value="feb">2月</option> <option value="mar">3月</option> <option value="apr">4月</option> <option value="may">5月</option> <option value="jun">6月</option> <option value="jul">7月</option> <option value="aug">8月</option> <option value="sep">9月</option> <option value="oct">10月</option> <option value="nov">11月</option> <option value="dec">12月</option> </select> ブラウザで表示すると、小さなドロップダウンメニューが表示されました。ドロップダウンメニューをクリックすると、1月から12月の項目が縦に並びます。月を選択するドロップダウンメニューと同じように、日にちのドロップダウンメニューも追加してみましょう。月と日にちを組み合わせて、簡単な日付の選択バーができましたね。つづいて、都道府県を選択するドロップダウンメニューをつくってみましょう。 name属性で”address”と指定し、<option>タグで各都道府県の項目をつくり、valueに県名を指定します。さらに、項目を選択しやすくするために<optgroup>タグで<option>タグをグルーピングしましょう。 name属性、value属性で指定した値は、送信された先でデータの集計や保存をする際に使われます。 <optgroup label="関東"> <option value="tokyo">東京</option> <option value="chiba">千葉</option> <option value="saitama">埼玉</option> </optgroup> <optgroup label="関西"> <option value="osaka">大阪</option> <option value="hyogo">兵庫</option> <option value="kyoto">京都</option> </optgroup> <optgroup>タグで<option>をグルーピングすると、都道府県名の頭に<optgroup>タグで指定した”関東”と”関西”が表示されました。 “関東”と”関西”をグルーピングすることで、ユーザーも探しやすそうですね。選択肢の多い項目はラジオボタンやチェックボックスよりも、ドロップダウンメニューを利用して表示したほうが表示スペースがコンパクトになり、ページがすっきりします。選択肢が多いときには<optgroup>タグを適宜利用して項目を整理すると、ユーザー目線の使いやすいページが作れます。今回はドロップダウンメニューを表示する方法についてご紹介しました。 HTMLでフォームをさらにカスタマイズしたい場合は、HTMLでラジオボタンとチェックボックスを表示する方法も合わせてご覧ください。 [PR] Webデザインで副業する学習方法を動画で公開中執筆してくれたメンターメンターSSさん文系・未経験でIT企業に就職して、9年目。環境構築から開発・設計・テストまで何でも屋さんをやっていました。テックアカデミーではJavaコースを担当しています。大石ゆかり selectタグがあって、その中にoptionタグで選択項目を表示しているっていうのはわかるんですが・・・。田島悠介 HTMLではできないけど、PHPプログラミングで送ったデータを受け取れるんだよ。selectのname属性の設定値をもとに、選択項目の値を受け取れるんだ。気になる場合は、PHPでセレクトボックスから値を受け取る方法を読んでみて。大石ゆかり selectタグも、ページ表示時に項目を選択状態にしておくことはできるんですか？田島悠介できるよ！optionタグにselectedを設定することで、optionタグの項目を選択状態にできるよ。チェックボックスの時は、checkedだったね。 HTMLを学習中の方へこれで解説は終了です、お疲れさまでした。つまずかず「効率的に」学びたい副業や転職後の「現場で使える」知識やスキルを身につけたい HTMLを学習していて、このように思ったことはありませんか？テックアカデミーのWebデザインコースでは、第一線で活躍する「プロのWebデザイナー」が教えているので、効率的に実践的なスキルを完全オンラインでしっかり習得できます。合格率10%の選考を通過した、選ばれたWebデザイナーの手厚いサポートを受けながら、オリジナルのWebサイト制作を完全オンラインでしっかり習得できます。まずは一度、無料体験で学習の悩みや今後のキャリアについて話してみて、「現役Webデザイナーから教わること」を実感してみてください。時間がない方、深く知ってから体験してみたい方は、今スグ見られる説明動画から先に視聴することをおすすめします！

HTML

Javaで配列の初期値を設定する方法について現役エンジニアが解説【初心者向け】

Javaで配列の初期値を設定する方法について、TechAcademyのメンター（現役エンジニア）が実際のコードを使用して初心者向けに解説します。そもそもJavaについてよく分からないという方は、Javaとは何なのか解説した記事を読むとさらに理解が深まります。なお本記事は、TechAcademyのオンラインブートキャンプJava講座の内容をもとに作成しています。田島悠介今回は、Javaに関する内容だね！大石ゆかりどういう内容でしょうか？田島悠介配列の初期値を設定する方法について詳しく説明していくね！大石ゆかりお願いします！目次初期値を設定する方法とは値を代入する実際に書いてみようまとめ初期値を設定する方法とは Javaの配列で任意の値を初期値として設定する方法を解説します。配列を生成しても、その要素の値はNullです。しかし、java.util.Arraysクラスのfillメソッドという、配列の各要素に対して値を一括で設定できるメソッドがあります。そのため、配列型の変数を定義した直後に、このfillメソッドを使用することで配列の初期値を設定していることと同意味に扱うことができます。 [PR] Webデザインで副業する学習方法を動画で公開中値を代入する fillメソッドを使用した、配列の初期値を設定する書き方は以下の通りです。 Arrays.fill(配列型の変数, 設定する値); 第一引数には、予め定義している配列型の変数を指定します。第二引数には、初期値として設定したい値を指定します。ここで注意したいことは配列の要素に値が既に設定されていた場合も、fillメソッドに設定した値で上書きされてしまうということです。実際に書いてみようコードは以下のようになります。 import java.util.Arrays; public class FillTest { public static void main(String[] args) { //配列numAryの全要素に"0"をセットする Integer[] numAry = new Integer[3]; Arrays.fill(numAry, 0); //配列の全要素をコンソール表示する System.out.println("初期値としてゼロを設定：" + Arrays.asList(numAry)); //一括で"5"を設定する Arrays.fill(numAry, 5); //配列の全要素をコンソール表示する。 System.out.println("次に5を一括で設定：" + Arrays.asList(numAry)); } } まとめいかがでしたか。今回はArraysクラスのfillメソッドを使用した、配列の初期値を設定する方法を説明しました。配列の各要素の初期値がNullになってしまうと不都合なことがあります。実務では数値型の配列の場合はゼロ、文字列型の配列の場合は空白を初期値として設定することがよくあります。監修してくれたメンターメンターK 独立系SIerで6年勤務後、現在は製造業の社内SEとして働いている。開発言語はJava, C#, VBAを得意としており、生産管理システムの運用や開発に携わっている。大石ゆかり内容分かりやすくて良かったです！田島悠介ゆかりちゃんも分からないことがあったら質問してね！大石ゆかり分かりました。ありがとうございます！ TechAcademyでは、初心者でもJavaやServletの技術を使ってWebアプリケーション開発を習得できるオンラインブートキャンプJava講座を開催しています。挫折しない学習方法を知れる説明動画や、現役エンジニアとのビデオ通話とチャットサポート、学習用カリキュラムを体験できる無料体験も実施しているので、ぜひ参加してみてください。

Java

記事を検索

ニュース

インタビュー

テクノロジー

キャリア

お問い合わせ

HTMLでvalue属性を使って入力初期値を指定する方法を現役エンジニアが解説【初心者向け】

監修してくれたメンター

ノマリカ

目次

value属性とは

value属性が使えるタグ