在网页中,本地存储是在浏览器中保存数据的一种方式,它有两种主要的方法:localStorage和sessionStorage。这两种方法都是在浏览器中存储数据,但是它们之间是不共享的。下面是一个示例,说明了如何使用localStorage和sessionStorage来在页面之间传递数据。
首先,我们使用localStorage来存储数据。在第一个页面中,我们使用setItem()方法将数据存储到localStorage中:
// 第一个页面
localStorage.setItem('data', 'Hello World');
然后,在第二个页面中,我们可以使用getItem()方法来获取存储在localStorage中的数据:
// 第二个页面
var data = localStorage.getItem('data');
console.log(data); // 输出:Hello World
在这个示例中,我们可以看到,无论我们在哪个页面中调用getItem()方法,都可以获取到之前存储在localStorage中的数据。
但是,如果我们尝试使用sessionStorage来存储数据,情况就不同了。sessionStorage是在会话期间保存数据的,当会话结束时,数据也会被清除。所以,sessionStorage中的数据在不同的页面之间是不共享的。
// 第一个页面
sessionStorage.setItem('data', 'Hello World');
// 第二个页面
var data = sessionStorage.getItem('data');
console.log(data); // 输出:null
在第二个页面中,我们尝试获取sessionStorage中的数据,但是结果是null,因为数据在两个页面之间是不共享的。
总结起来,如果你想在页面之间共享数据,可以使用localStorage来存储数据;如果你只需要在当前会话期间共享数据,可以使用sessionStorage来存储数据。