以下是一个使用本地存储值在HTML / JavaScript中显示的解决方法的代码示例:
HTML部分:
本地存储示例
本地存储示例
JavaScript部分(script.js文件):
// 保存值到本地存储
function saveValue() {
// 获取输入框的值
var value = document.getElementById("inputValue").value;
// 检查浏览器是否支持本地存储
if (typeof(Storage) !== "undefined") {
// 使用localStorage保存值
localStorage.setItem("storedValue", value);
console.log("值已保存到本地存储");
} else {
console.log("浏览器不支持本地存储");
}
}
// 在页面加载时从本地存储中获取值并显示
window.onload = function() {
// 检查浏览器是否支持本地存储
if (typeof(Storage) !== "undefined") {
// 从localStorage获取值
var storedValue = localStorage.getItem("storedValue");
// 检查是否有保存的值
if (storedValue) {
// 在页面上显示值
document.getElementById("displayValue").innerText = "保存的值是:" + storedValue;
} else {
document.getElementById("displayValue").innerText = "没有保存的值";
}
} else {
console.log("浏览器不支持本地存储");
}
}
上述代码实现了以下功能:
注意:上述代码使用的是localStorage来保存值。你也可以使用sessionStorage或cookie来实现类似的功能,具体选择取决于你的需求。