i was wondering how i could do the following:

1. I get the input from the user using form(okay fine)
2. i take that input and store it as a variable in javascript(got it).
3. The variable i just saved changes the text of another page in the website (it permanently changes the text of that webpage and isn't depended on the js variable of that file anymore(it can also import the text into the web page if need be if possible)) for eg:- enter image description here

Here the user enters the details let's say the name for now

and then in the second img the text of the website changes, and when i download the second img website which doesn't hold the original js which stored the variable, it still shows the text as it might have stored the text in the file locally using js or something. [2]: https://i.stack.imgur.com/4nZCD.png

Please help me out.

CodePudding user response：

It will be helpful if you send codesandbox link then we can understand your problem clearly

CodePudding user response：

In my experience, the best way to store information from page-to-page is through local storage.

Local storage persists from page to page, while JavaScript variables are cleared out, and cookies can be un-reliable based on the response from the server they are sent too.

In your function that takes the user input, write something along the lines of:

localStorage.setItem('myCat', 'Tom');

And to retrieve this information, you can reference it like:

const cat = localStorage.getItem('myCat');

Here is a reference: https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage