Как я могу поместить <Input><datalist> в файл JS, потому что вес HTML увеличивается?

Question

Я должен передать огромный набор данных из списка городов / мест в определенной стране пользователям, потому что он будет многоразовым.

Я могу просто поместить его в код HTML следующим образом:

<datalist id="cities">
<option value="Mumbai">
<option value="New Delhi">
<option value="Moscow">
<option value="New York">
<option value="Washington">
</datalist>

Мне кажется, что каждый раз, когда пользователь перезагружает страницу, все это делает файл HTML очень тяжелым.

Могу ли я как-то поместить его в файл JS и передать его в DOM / HTML без какого-либо громоздкого кода?

a) Можно ли это сделать? Б) Это хорошая идея?

Answer 1

Так что после некоторого возни и осмотра я сам нашел решение проблемы.

Это включает в себя использование JavaScript.К этому куску HTML-кода:

Я добавил этот простой JavaScript.

<script>
datalist=document.getElementById("countries");
datalist.empty();
datalist.append("<option value="India"><option value="Vietnam"><option value="Russia"><option value="Greece"><option value="New Zealand">")
</script>

И это работает.

Теперь моей следующей целью будет заполнение этого дополнения циклом for next.Это сделает код еще меньше для большого списка данных.