Share data between HTML pages

Question

I want to send some data from one HTML page to another HTML page. I send data via query parameters like http://localhost/project/index.html?status=exist etc. The problem with this approach is that the data remains in the URL. Is there any other way to send data between HTML pages using JavaScript or jquery.

Answer 1

I know this is an old post, but I thought I'd share my two cents. @Neji is correct, you can use sessionStorage.getItem('label') and sessionStorage.setItem('label', 'value') (although he has setItem Parameters backwards, no big deal). I prefer the following, I think it's more concise:

var val = sessionStorage.myValue

replaces getItem and

sessionStorage.myValue = 'value'

instead of setItem.

Additionally, it should be noted that in order to store JavaScript objects, they must be stringified to set them, and parsed to get them, as follows:

sessionStorage.myObject = JSON.stringify(myObject); //will set object to the stringified myObject
var myObject = JSON.parse(sessionStorage.myObject); //will parse JSON string back to object

The reason is that sessionStorage stores everything as a string, so if you just say sessionStorage.object = myObject all you get is [object Object], which doesn't help you much.

Answer 2

Why not store the value in an HTML5 storage object such as sessionStorage or localStorage, please visit the HTML5 Storage documentation for more details. Using this feature you can store intermediate values ​​locally temporarily/permanently and then access your values ​​later.

Storage session value:

sessionStorage.setItem('label', 'value')
sessionStorage.getItem('label')

or more permanent:

localStorage.setItem('label', 'value')
localStorage.getItem('label')

So you can use HTML5 storage objects to store (temporary) form data across multiple pages and even persist this data across reloads.