как с помощью localStorage сделать так чтобы теги
создаваемые в JavaScript не исчезали после перезагрузки? без jQuery
js
function fuf() {
let ghj = document.querySelector('body');
ghj.innerHTML += "<p>приветик</p>";
}
html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width">
<title>Document</title>
</head>
<body onload="fyf()">
<button onclick="fuf()">кликЕР</button>
<p id="loshok"></p>
<script src="code.js"></script>
</body>
</html>
Ответы (1 шт):
В твоём варианте это будет жестко :)
Сохранять - вот так...
localStorage.setItem("saved",
JSON.stringify([...document.querySelectorAll("body p")]
.map(el => el.innerText)
)
);
Читать - вот так...
let savedParagraphs = JSON.parse(localStorage.getItem("saved")) || [];
savedParagraphs.forEach(text => {
let newElement = document.createElement("p");
newElement.innerText = text;
document.body.appendChild(newElement);
});
В чём прикол... В localStorage можно хранить только строки! Поэтому массив надо сохранить как JSON и потом прочитать как JSON. Если прочитать не удалось, то результат getItem == null. JSON.parse(null) будет null и если результат null то null или пустой_массив - || [] вернёт пустой массив. Потом обходим (если был) каждый элемент по словам и создаём параграф - (не вот так ghj.innerHTML += "<p>приветик</p>") что в корне не правельно, а правильно через создание DOM элемента параграф, и установкой ему текстового значения. Потом присоеденяем новый созданный элемент к тэгу BODY у которого есть символическая ссылка document.body