如何在本地保存html数据

Question

如何在用户关闭浏览器后保存我的HTML元素标记数据。例如

<div class="classOne" data-random="50"> 

，我用jQuery来改变数据属性

$(".classOne").attr("data-random","40") 

而且如果用户关闭了浏览器，回来值数据随机将40我如何能实现这个 ？

Answer 1

您试过看localStorage？

LocalStorage允许您在浏览器中存储数据。因此，甚至在用户关闭了浏览器和回来，你还是已存储在您的localStorage

这里的价值上，你可以如何使用本地存储的样本代码：

localStorage.setItem("data-random", 40); 

Answer 2

您可以设置它搭配：

localStorage.setItem("data-random","40") 

后来加载：

localStorage.getItem("data-random") 

如果你想存储JSON对象，在保存之前应该使用stringify()并且在加载之后使用JSON.parse()。

Answer 3

尝试localStorage。

https://developer.mozilla.org/ko/docs/Web/API/Window/localStorage

$(document).onload(function(){ 
    if(localStorage.rendomData){ 
     var data = localStorage.rendomData - 10 
     localStorage.set(randomData,data) 
    } 
    else{ 
     localStorage.set(randomData,50) 
    } 
}) 

我希望这有助于。

Answer 4

实现它的最简单方法是使用cookie。只要看看这个插件：https://github.com/carhartl/jquery-cookie，然后上面的一行：

$(".classOne").attr("data-random","40") 

地址：

var randValue; 
if (typeof $.cookie('my-rand-value') == undefined) { 

    // generate random value 
    randValue = generateRandomValue //assign random value to variable 
    $.cookie('my-rand-value', randValue) 

} 
else { 
    randValue = $.cookie('my-rand-value') 
} 

末改变静态价值，你的变量：

$(".classOne").attr("data-random",randValue) 

Answer 5

你可以做到这一点的使用Cookie以及使用本地存储 -
本地存储第一次存储首先尝试获取值，如果它被存储为 -

if(localStorage.getItem("data-random") != null){ 
    return localStorage.getItem("data-random"); 
} else { 
    return 50; 
} 

，当用户更改值可以通过保存的值 -

localStorage.setItem("data-random", value); 

Answer 6

使用jQuery功能beforeunload，并保存到localStorage的。

$(window).on('beforeunload', function() { 

// Put the object into storage 
localStorage.setItem('data', $(".classOne").attr("data-random")); 

}); 

每当打开页面时从存储中检索数据。

var retrievedData = localStorage.getItem('data');