Как выбрать тег <select>, включая отмеченные и не отмеченные опции, используя queryselectorAll()?

Question

//initial  code   

var selectInputs = document.querySelectorAll('option:checked');
    var selectArray=[];                        
      for(var i=0;i<selectInputs.length;i++)
          {
            selectArray[i]=selectInputs[i].value;//am doing this since I found out (from stackru) that selectInputs contains a NodeList and in order to use it, it must be converted or saved as an array
          }

     //later stage manipulation code

var input_select=  document.querySelectorAll('option:checked');
for(var i=0;i<input_select.length;i++)
{
input_select[i].value=selectArray[i];//I am trying to change the value of the <select> option
}

ЦЕЛЬ: Пользователь выбирает опцию в форме, и данные сохраняются в локальном хранилище. Я хочу отразить то же самое, когда форма перезагрузится. Я не работаю для конкретной формы, поэтому использование Jquery кажется бесполезным (так как он работает с классом или идентификатором, и я не знаю идентификатор или класс любого тега универсальной формы)

ПРОБЛЕМА. Проблема в том, что я хочу выбрать весь набор опций тега, а не только те, которые были отмечены / выбраны. Приведенный выше код устанавливает значение выбранной по умолчанию опции, которая хранится в локальном хранилище, но не отражает изменение в форме. Он всегда отображает значение по умолчанию, хотя и дает

alert(input_select[i].value);

отражает внутренние изменения отлично!

Answer 1

Думаю, я должен ответить на свой вопрос:-D

Если бы вы могли видеть, есть только одно глупое изменение в

// поздняя стадия манипулирования кодом ВЫШЕ.

ОТВЕТ:

var input_select=  document.querySelectorAll('select');
for(var i=0;i<input_select.length;i++)
{
input_select[i].value=selectArray[i];//I am trying to change the value of the <select> option
}

Вместо

var input_select=  document.querySelectorAll('option:checked');

Это должно быть

var input_select=  document.querySelectorAll('select');

ПРИЧИНА: Я пытался присвоить сохраненное значение самой опции (тегу опции), а не метке выбора в целом.

ВНИМАНИЕ: в коде

input_select[i].value=selectArray[i];

Это также может быть

input_select[i].value="Friday";

при условии, что у вас уже есть такая опция, иначе она будет отображаться пустым.

<select name="days" id=days">
<option value="0"> Friday </option>
<option value="1"> Monday </option>
</select>

works

<select name="days" id=days">
<option value="0"> Saturday </option>
<option value="1"> Monday </option>
</select>

doesn't work. Shows a blank.