解释一下function onload1(){ var username = sessionStorage.getItem("username"); var spanUser = document.getElementById("spanUser"); spanUser.innerHTML = username;
时间: 2024-04-09 15:32:02 浏览: 60
这段代码定义了一个名为 `onload1` 的函数。该函数的目的是从 sessionStorage 中获取用户名,并将其设置为指定元素的内容。
首先,它使用 `sessionStorage.getItem("username")` 从 sessionStorage 中获取保存的用户名,并将其赋值给变量 `username`。
接下来,它使用 `document.getElementById("spanUser")` 获取具有指定 id 属性的元素,这里是一个 `<span>` 元素,该元素用于显示用户名。
最后,它使用 `spanUser.innerHTML = username` 将获取到的用户名赋值给 `<span>` 元素的 `innerHTML` 属性,从而在页面上显示用户名。
总的来说,这段代码的作用是在页面加载完成后,从 sessionStorage 中获取用户名,并将其显示在指定的 `<span>` 元素中。
相关问题
我想在页面刷新或前进后退时使用使用vue sessionStorage.setItem这个方法 请举例
好的,您可以像下面这样使用vue sessionStorage.setItem方法:
// 在页面加载时
window.onload = function() {
// 从sessionStorage中获取数据并设置到input框中
var inputVal = sessionStorage.getItem('inputVal');
document.getElementById('input').value = inputVal;
}
// 在页面离开时
window.onbeforeunload = function() {
// 将input框中的数据存储到sessionStorage中
var inputVal = document.getElementById('input').value;
sessionStorage.setItem('inputVal', inputVal);
}
这样,当用户在页面中输入数据并进行刷新或前进后退操作时,数据将会被自动保存到sessionStorage中,下次用户重新进入该页面时,之前输入的数据将会被自动还原。
使用sessionStorage和json存储写一个备忘录页面
好的,使用sessionStorage和json存储可以实现一个简单的备忘录页面。具体实现步骤如下:
1.创建一个HTML页面,包括输入框和按钮,用于添加备忘录条目。
2.在JavaScript中定义一个数组,用于存储备忘录条目。
3.为按钮添加点击事件,当用户点击按钮时,将输入框中的文本添加到数组中。
4.使用JSON.stringify()方法将数组转换为JSON格式的字符串。
5.将JSON字符串存储在sessionStorage中,可以使用sessionStorage.setItem()方法。
6.当页面重新加载时,从sessionStorage中读取保存的JSON字符串,并将其转换为数组。
7.使用循环遍历数组,并将每个备忘录条目显示在页面上。
8.如果用户想要删除一个备忘录条目,可以从数组中删除该条目,然后再次将数组保存到sessionStorage中。
下面是实现代码示例:
HTML部分:
```
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>备忘录</title>
</head>
<body>
<input type="text" id="memoInput">
<button onclick="addMemo()">添加备忘录</button>
<ul id="memoList"></ul>
</body>
</html>
```
JavaScript部分:
```
//定义一个数组,用于存储备忘录条目
var memoArray = [];
//添加备忘录条目
function addMemo() {
//获取输入框中的文本
var memoText = document.getElementById("memoInput").value;
//将备忘录条目添加到数组中
memoArray.push(memoText);
//将数组转换为JSON格式的字符串
var memoJson = JSON.stringify(memoArray);
//将JSON字符串保存到sessionStorage中
sessionStorage.setItem("memoList", memoJson);
//更新备忘录列表
updateMemoList();
}
//更新备忘录列表
function updateMemoList() {
//从sessionStorage中获取JSON字符串
var memoJson = sessionStorage.getItem("memoList");
//如果JSON字符串存在,则将其转换为数组,并显示在页面上
if (memoJson !== null) {
memoArray = JSON.parse(memoJson);
var memoList = document.getElementById("memoList");
memoList.innerHTML = "";
for (var i = 0; i < memoArray.length; i++) {
var memoItem = document.createElement("li");
memoItem.innerHTML = memoArray[i] + "<button onclick='deleteMemo(" + i + ")'>删除</button>";
memoList.appendChild(memoItem);
}
}
}
//删除备忘录条目
function deleteMemo(index) {
memoArray.splice(index, 1);
var memoJson = JSON.stringify(memoArray);
sessionStorage.setItem("memoList", memoJson);
updateMemoList();
}
//页面加载完成后更新备忘录列表
window.onload = updateMemoList;
```
阅读全文