Сохранить входные данные в localStorage при нажатии кнопки

Question

Я пытаюсь создать свое первое веб-приложение. В моем приложении мне нужно иметь панель настроек, но я понятия не имею, как это сделать. Я искал в Интернете и натолкнулся на localStorage HTML5, который, я считаю, может быть лучшим способом сделать это. Но проблема в том, что я понятия не имею, как ее использовать.

<input type='text' name="server" id="saveServer"/> 

Как я могу сохранить данные из ввода в localStorage, когда пользователь нажимает кнопку? Что-то вроде этого?

<input type='text' name="server" id="saveServer"/> 

<button onclick="save_data()" type="button">Save/button> 

    <script> 
      function saveData(){ 
     localStorage.saveServer 
     } 
     </script> 

Answer 1

Объект localStorage имеет setItem метод, который используется для хранения элемента. Он принимает 2 аргумента - ключ, с помощью которого вы можете обратиться к элементу, и значение:

var input = document.getElementById("saveServer"); 
localStorage.setItem("server", input.value); 

Приведенный выше код первым получает ссылку на input элемент, а затем сохраняет элемент («сервер») в локальное хранилище со значением значения этого элемента input.

Вы можете получить значение с помощью вызова getItem:

var storedValue = localStorage.getItem("server"); 

Answer 2

Это работает для меня. Для установки я поставил .value за var и назвал var в setItem:

var input = document.getElementById('saveServer').value; 
localStorage.setItem('server', input); 

Для получения текста обратно:

document.getElementById('saveServer').value = localStorage.getItem('server');