Problem with localStorage

#html #javascript #localstorage #help

Hi guys! I have a problem.
https://pastebin.com/pPCpxT9N
By this code I would like to change the text written in the paragraph from "Text" to "Another text", and I want to save the changement by localStorage, but it doesn't work. Can you tell me why?

Top comments (5)

Marc • Nov 6 '19

Check this out: codepen.io/jofrly/pen/oNNdLpL

I think the main Problem with your code was that you defined the window.onload function within the changeAndStoreText function.

Still: You save the text content to the local storage before changing it.
Therefore the first time you click the button, the string Text gets saved to the local storage.
The second time you click the button, the string Another text gets saved to the local storage.
When you reload the page after clicking the button the second time, the paragraph gets populated with Another text.

AndyBullet • Nov 7 '19

Is there a way to make it work on a single click?

Marc • Nov 7 '19

Yes:

function changeAndStoreText() {
  textElement.innerHTML = 'Another text';
  var textContent = textElement.textContent;
  localStorage.setItem('firstScreenText', textContent);
}

Moritz Schramm • Nov 6 '19

My current guess: You need to prevent the default behavior of the button. Normally the page just reloads which is the reason why you cannot see your changes.