Как создать список элементов localStorage в JavaScript

#javascript #jquery #html

#javascript #jquery #HTML

Вопрос:

У меня ошибка с сохраненными значениями localStorage, я получил такой результат [«джон», «смит», «шарик», «это сохраненное значение»]

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

я хочу вот так:-

джон
смит
шарик
это сохраненное значение

как я могу этого добиться, пожалуйста, помогите мне ниже моих кодов->

 $(".searchsome").on("click",function search(e) {
addEntry();
var entry = localStorage.getItem("allEntrie");
for (var i = 0; i < entry.length; i  ) {
$(".showSearchData").append('<p class="keywordsOnDiv">'   entry[i]   '</p>');
});

function addEntry() {
var existingEntries = JSON.parse(localStorage.getItem("allEntrie"));
if(existingEntries == null) existingEntries = [];
var entryTitle = $(".searchsome").val();
localStorage.setItem("entrys", entryTitle);
existingEntries.push(entryTitle);
localStorage.setItem("allEntrie",existingEntries);
};

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

1. existingEntries.join("n")

2. ["john","smith", "sharik", "this is stored value"] это строка или массив?

3. где я могу использовать эту строку?

4. это массив @brk

5. но localStorage.getItem("allEntrie") выдаст строку, а не массив

Ответ №1:

Если значение, хранящееся в localStorage, похоже '["john","smith", "sharik", "this is stored value"]'

затем используйте JSON.parse в этой строке

 var entry = JSON.parse(localStorage.getItem("allEntrie"));
for (var i = 0; i < entry.length; i  ) {
$(".showSearchData").append('<p class="keywordsOnDiv">'   entry[i]   '</p>');
});

1. он разделяет каждое слово на новую строку, не разделяя на каждый элемент

2. что вы подразумеваете под each item

3. каждый элемент означает, как Смит, шарик, Джон и все

4. Большое вам спасибо @brk наконец-то я получил свой результат благодаря вам, спасибо

5. @Equaltomultiply рад помочь

Ответ №2:

Попробуйте использовать приведенную ниже простую панель поиска, в которой хранятся ключи localStorage , но убедитесь, что вы удалили var localStorage = {}; ее только для тестирования в Stackoverflow.

Это позволит получить сохраненные данные из localStorage массива и преобразовать их обратно в строку после добавления нового элемента и сохранить его снова.

 function addEntry(v) {
  //------------------------
  var localStorage = {}; // <--- remove this line
  //------------------------


  var existingEntries = JSON.parse(localStorage["allEntrie"] || "[]");
  existingEntries.push(v);
  localStorage["entrys"] = v;
  localStorage["allEntrie"] = JSON.stringify(existingEntries);
  return v;
};

$(".searchsome").on("keyup", function() {
  var v = this.value.replace(/s /g, " ").trim();
  $(".showSearchData").prepend('<p class="keywordsOnDiv">'   addEntry(v)   '</p>');
});

 p {
  padding: 1px;
  margin: 1px;
}

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input class="searchsome" />
<div class="showSearchData">
  <div>