JavaScript を使用して選択要素にオプションを動的に作成する方法

JavaScript を使用して選択にオプションを追加する

Q: ID が「mainSelect」の選択要素に 12 から 100 までのオプションを動的に作成したいと考えています。各オプション タグを手動で作成せずにこれを実現するにはどうすればよいですか?

A: 単純な for ループを使用した解決策は次のとおりです:

var min = 12,
    max = 100,
    select = document.getElementById('selectElementId');

for (var i = min; i<=max; i++){
    var opt = document.createElement('option');
    opt.value = i;
    opt.innerHTML = i;
    select.appendChild(opt);
}

このコード内:

• 最初にオプションの最小値と最大値を宣言します。
• 次に、document.getElementById() を使用して選択要素を取得します。
• 次に、最小値から最大値まで。
• 反復ごとに、option 要素を作成し、その値と innerHTML を設定し、最後に select 要素に追加します。

このアプローチは効率的です。また、特定の選択要素に対して一連のオプションを動的に簡単に作成できます。

以上がJavaScript を使用して選択要素にオプションを動的に作成する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。