当前博客:浏览器持久储存的增删改查

181 次浏览【转载需注明来源】


<!文档类型 网页类型>
<网页 语言代码="中文">
	<网页头部>
		<网页信息 文档编码="UTF8" />
		<网页信息 名称="页面视图" 关联数据="视图宽度=填充视图宽度,初始缩放值=1,最大缩放值=1,用户缩放状态=假" />
		<网页信息 关联HTTP="兼容模式" 关联数据="最高IE版本" />
		<网页标题>Document</网页标题>
	</网页头部>
	<网页主体>
		<区块 行内样式="边框: 2px 虚线 颜色值-黑色; 宽度: 320px; 文本-对齐: 居中">
			<数据框标注 绑定元素="数据名称">数据名称:</数据框标注>
			<数据框 数据类型="文本输入" id="数据名称" 属性名称="数据名称"/>
			<换行>
			<数据框标注 绑定元素="数据内容">数据内容:</数据框标注>
			<数据框 数据类型="文本输入" id="数据内容" 属性名称="数据内容" />
			<换行>
			<按钮 点击回调="保存函数()">添加数据</按钮>
			<分割线 />
			<数据框标注 绑定元素="查询的数据名">数据名称:</数据框标注>
			<数据框 数据类型="文本输入" id="查询的数据名" 属性名称="查询的数据名" />
			<换行>
			<按钮 点击回调="查询函数()">查询</按钮>
			<按钮 点击回调="查询删除函数()">删除</按钮>
			<段落 id="查询结果"><换行></段落>
		</区块>
		<区块 id="数据表"></区块>
		<脚本>
			显示全部();
			定义函数 保存函数() {
				变量 数据名称 = document.getElementById("数据名称").value;
				变量 数据内容 = document.getElementById("数据内容").value;
				浏览器持久储存.保存数据(数据名称, 数据内容);
				显示全部();
			}
			定义函数 查询函数() {
				变量 查询的数据名 = document.getElementById("查询的数据名").value;
				变量 数据内容 = 浏览器持久储存.读取数据(查询的数据名);
				变量 查询结果 = document.getElementById("查询结果");
				查询结果.innerHTML = 查询的数据名 + "的网址是:" + 数据内容;
			}
			定义函数 查询删除函数() {
				变量 查询的数据名 = document.getElementById("查询的数据名").value;
				变量 数据内容 = 浏览器持久储存.读取数据(查询的数据名);
				浏览器持久储存.删除数据(查询的数据名);
				显示全部();
			}
			定义函数 显示全部() {
				变量 数据表 = document.getElementById("数据表");
				如果 (浏览器持久储存.长度 > 0) {
					变量 result = "<表格 边框线='显示边框线'>";
					result += "<表格行><表格内容>数据名称</表格内容><表格内容>数据内容</表格内容><表格内容>操作</表格内容></表格行>";
					循环 (变量 i = 0; i < 浏览器持久储存.长度; i++) {
						变量 数据名称 = 浏览器持久储存.获取键名(i);
						变量 数据内容 = 浏览器持久储存.读取数据(数据名称);
						result += "<表格行>" + "<表格内容>" + 数据名称 + "</表格内容>" + "<表格内容>" + 数据内容 + "</表格内容>" + "<表格内容><数据框 数据类型=button 数据值=删除 点击回调=直接删除函数(" + "'" + 数据名称 + "'" + ") ></表格内容>" + "</表格行>";
					}
					result += "</表格>";
					数据表.innerHTML = result;
				} 否则 {
					数据表.innerHTML = "数据为空……";
				}
			}
			定义函数 直接删除函数(名称) {
				浏览器持久储存.删除数据(名称);
				显示全部();
			}
		</脚本>
	</网页主体>
</网页>
默认排序
Generic placeholder image
Generic placeholder image
快码FOF编程 Time: 2023-05-04 18:28:16

感谢你的分享


浏览器持久储存的增删改查