コピペで使える JavaScript逆引きリファレンス

JavaScript/jQuery開発時に、こそっとお使いください。

JavaScript サンプルソース フォーム関連

[JavaScript] セレクトボックス値を動的に生成する

投稿日:2016年10月18日 更新日:

連想配列オブジェクトの値から、セレクトボックスの要素を動的に生成するサンプルです。

サンプルソース

例)連想配列arrの値でセレクトボックス値を動的に生成する

実行サンプル

ボタンを押すと、セレクトボックスを動的に生成します。

 
※ボタンを押す前は要素はありませんが、押した後は要素が生成されます。

解説

  • HTML要素はdocument.createElementで作ることができます。
  • 作った要素を子要素としてHTMLに追加するには、appendChildで追加できます。

スポンサーリンク

スポンサーリンク

-JavaScript, サンプルソース, フォーム関連
-

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

[JavaScript] セレクトボックスを未選択状態にする

セレクトボックスを未選択状態にするには、selectedIndexに -1 をセットすればOKです。 サンプルソース 例 ...

[JavaScript] HTMLタグに独自属性を設定する(dataset)

HTMLタグに独自の属性を設定したい場合は、datasetという仕組みを使用します。 カスタムデータ属性とも呼ばれます ...

[JavaScript] ブランクチェックを行う

指定された値がnullまたは空文字でないことをチェックする関数です。 コピペしてそのままお使い頂けます。 サンプル 例) ...

[JavaScript] 配列の要素をクリアする

配列の要素をクリアするサンプル(2パターン)です。 サンプルソース 例1)配列の要素をクリアする(空の配列で上書きする) ...

[JavaScript] 文字列を繰り返す

文字列を指定した回数繰り返した結果を取得するサンプルです。 サンプルソース 文字列を指定した回数繰り返した値を取得するに ...

スポンサーリンク