javascriptを使用してドロップダウンリストにオプション値を設定するにはどうすればよいですか？

Question

JavaScriptファイル内のオブジェクトを使用してドロップダウンリストを作成したいとします。
私はcityListという名前のオブジェクトがあります。これはユーザーによって異なります。 HTMLページにそのオブジェクトを含むドロップダウンリストを作成したいと思います。私はこれをどのようにするべきですか？テキストフィールドには.val()を使用できますが、ドロップダウンはどうですか？

Answer 1

編集：

あなたの質問は完全に間違っています。 selectタグはちょうどinputタグのように設定されています。

https://jsfiddle.net/ryanpcmcquen/xtxnbq4o/

window.addEventListener('DOMContentLoaded', function() { 
 
    var lists = { 
 
    city: [ 
 
     '<option>Foo</option>', 
 
     '<option>Bar</option>' 
 
    ], 
 
    state: [ 
 
     '<option>Baz</option>', 
 
     '<option>Zot</option>' 
 
    ] 
 
    }; 
 

 
    var createListMaker = function(type) { 
 
    document.querySelector('.' + type + '_maker').addEventListener('click', function() { 
 
     var select = document.createElement('select'); 
 
     lists[type].map(function(option) { 
 
     select.innerHTML += option; 
 
     }); 
 
     document.body.appendChild(select); 
 
    }); 
 
    }; 
 

 
    createListMaker('city'); 
 
    createListMaker('state'); 
 

 
});

<button class="city_maker"> 
 
    Create City dropdown 
 
</button> 
 
<button class="state_maker"> 
 
    Create State dropdown 
 
</button>

：

$('select').val('Bar');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select> 
 
    <option>Foo</option> 
 
    <option>Bar</option> 
 
</select>

は、私はあなたがこのような何かを達成しようとしていると信じて

このコードを改善するには、リストがまだ生成されていないことを確認する必要があります。現在、必要な数のリストを作成することができます。