当前位置: 首页 > news >正文

H5ke11--3介绍本地,会话存储

代码顺序:

1.设置input,捕获input如果有多个用属性选择符例如

input[type=file]点击事件.向我们的本地存储设置键值对

2.在点击事件外面设置本地存储表示初始化的值.点击上面的事件才能修改我们想修改的值


 会话(session)浏览a数据可以写到本地硬盘,关闭页面数据就没了

本地(localStorage):以前是a打开的,有数据.放在本地.以后打开b页面还可以有相同数据

除非清空缓存

大家一定要注意要清楚缓存在这里

清除之后就是

因为我减少了设置属性

现在

现在我不设置了想变空,变不会去啦,已经存在啦

只能修改

修改后

或者全部清空

localStorage.clear()
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body><input type="button" value="修改"><script>let btn=document.querySelector("input")btn.addEventListener("click",(event)=>{localStorage.setItem("name","Bobxiugai")localStorage.setItem("age","00")localStorage.setItem("tall","000")})console.log(localStorage.length);localStorage.setItem("name","Alice");// localStorage.setItem("age",20);// localStorage.setItem("tall","165.2");console.log(localStorage.length);console.log(localStorage.getItem("name"));console.log(localStorage.getItem("age"));console.log(localStorage.getItem("tall"));
</script>
</body>
</html>

宏观

 参考:本地存储三种方式得区别_本地存储的区别-CSDN博客

 indexedDB几乎就是一个完善的数据库系统,复杂


笔记

localStorage是Map,

方法

setItem(key,value)

getItem(key)得到

.key方法可以得到键

storage里面的值只能是字符串类型

java值可以任意类型

has方法

这节课,我们要用setItem保存

getitm写上去

key获取键

clear清除全部

Removeitem(key)

length

localStorage没有java的contain,我们用geitem


会引发的事件

加载器吧浏览器加载完了会引发load事件,准备关闭之前beforeunload….我们只要在这之前填充上去就行了 

相关文章:

H5ke11--3介绍本地,会话存储

代码顺序: 1.设置input,捕获input如果有多个用属性选择符例如 input[typefile]点击事件.向我们的本地存储设置键值对 2.在点击事件外面设置本地存储表示初始化的值.点击上面的事件才能修改我们想修改的值 会话(session)浏览a数据可以写到本地硬盘,关闭页面数据就没了 本地(…...

技术分享 | 如何写好测试用例?

对于软件测试工程师来说&#xff0c;设计测试用例和提交缺陷报告是最基本的职业技能。是非常重要的部分。一个好的测试用例能够指示测试人员如何对软件进行测试。在这篇文章中&#xff0c;我们将介绍测试用例设计常用的几种方法&#xff0c;以及如何编写高效的测试用例。 ## 一…...

quarkus的一些注解1

path 用于指定一个类或者方法的URL路径前缀。 Inject 将一个依赖注入到一个类或方法中 Get 用于指定一个处理HTTP GET请求 Produce 注解用于指定一个方法返回的内容类型。例如&#xff0c;Produces(MediaType.TEXT_PLAIN) 表示该方法返回一个纯文本类型的内容 QuarkusIn…...

初学Redis(Redis的启动以及字符串String)

首先使用在Windows PowerShell中输入指令来启动Redis&#xff1a; redis-server.exe 然后通过指令连接Redis&#xff1a; redis-cli 上图的127.0.0.1是计算机的回送地址 &#xff0c;6379是默认端口 上述代码中创建了两个键&#xff0c;注意Redis中严格区分大小写&#xff0…...

C++ opencv基本用法【学习笔记(九)】

这篇博客为修改过后的转载&#xff0c;因为没有转载链接&#xff0c;所以选了原创 文章目录 一、vs code 结合Cmake debug1.1 配置tasks.json1.2 配置launch.json 二、图片、视频、摄像头读取显示2.1 读取图片并显示2.2 读取视频文件并显示2.3 读取摄像头并写入文件 三、图片基…...

理财和银保区别

理财和银保在以下六个方面存在区别&#xff1a; 产品性质&#xff1a;银行理财是银行发行的理财产品&#xff0c;属于金融投资&#xff0c;主要投向债券、票据等固定收益类资产。银保产品是保险公司发行的保险产品&#xff0c;属于保障投资&#xff0c;除了固定收益类资产外&am…...

一文浅入Springboot+mybatis-plus+actuator+Prometheus+Grafana+Swagger2.9.2开发运维一体化

Swagger是一个规范和完整的框架,用于生成、描述、调用和可视化 RESTFUL风格的Web服务,是非常流行的API表达工具。 Swagger能够自动生成完善的 RESTFUL AP文档,,同时并根据后台代码的修改同步更新,同时提供完整的测试页面来调试API。 Prometheus 是一个开源的服务监控系统和时…...

【日常】爬虫技巧进阶:textarea的value修改与提交问题(以智谱清言为例)

序言 记录一个近期困扰了一些时间的问题。 我很喜欢在爬虫中遇到问题&#xff0c;因为这意味着在这个看似简单的事情里还是有很多值得去探索的新东西。其实本身爬虫也是随着前后端技术的不断更新在进步的。 文章目录 序言Preliminary1 问题缘起1.1 Selenium长文本输入阻塞1.2…...

C++知识点总结(6):高精度乘法真题代码

一、高精度数 低精度数 #include <iostream> #include <cstring> using namespace std;int main() {// 存储并输入两个数字 char a_str[1005] {};long long b;cin >> a_str >> b;// 特例先行&#xff1a;结果是0的情况if (a 0 || b 0){cout <&…...

Polygon zkEVM的Dragon Fruit和Inca Berry升级

1. Polygon zkEVM的Dragon Fruit升级 2023年8月31日&#xff0c;Polygon zkEVM团队宣称启动了其Mainnet Beta的Dragon Fruit升级的10天timelock&#xff0c;预计将于2023年9月11日激活。 Dragon Fruit升级点有&#xff1a; 改进了网络支持了最新的以太坊opcode——PUSH0 1.…...

【计算机网络学习之路】网络基础1

文章目录 前言一. 计算机网络发展局域网和广域网 二. 网络协议三. OSI七层模型四. TCP/IP四层&#xff08;五层&#xff09;模型五. 计算机体系结构与网络协议栈六. 协议形式及局域网通信数据包封装与分用 七. 跨网络通信八. MAC地址与网络通信的理解结束语 前言 本系列文章是…...

HTTP/2.0协议详解

前言 HTTP/2.0&#xff1a;互联网通信的革新标准 随着互联网技术的飞速发展&#xff0c;HTTP协议作为互联网应用最广泛的通信协议&#xff0c;也在不断演进和优化。HTTP/2.0是HTTP协议的最新版本&#xff0c;它旨在提供更高效、更安全、更快速的互联网连接。 一、HTTP/2.0的优…...

Python中的Random模块详解:生成随机数与高级应用

在Python编程中&#xff0c;随机数生成是许多应用的基础之一。random模块为我们提供了生成伪随机数的丰富工具&#xff0c;从简单的随机数生成到复杂的应用场景&#xff0c;都有很多功能可以探索。本文将深入介绍random模块的各个方面&#xff0c;通过详实的示例代码&#xff0…...

(论文阅读32/100)Flowing convnets for human pose estimation in videos

32.文献阅读笔记 简介 题目 Flowing convnets for human pose estimation in videos 作者 Tomas Pfister, James Charles, and Andrew Zisserman, ICCV, 2015. 原文链接 https://arxiv.org/pdf/1506.02897.pdf 关键词 Human Pose Estimation in Videos 研究问题 视频…...

【设计一个缓存--针对各种类型的缓存】

设计一个缓存--针对各种类型的缓存 1. 设计顶层接口2. 设计抽象类 -- AbstractCacheManager3. 具体子类3.1 -- AlertRuleItemExpCacheManager3.2 -- AlertRuleItemSrcCacheManager 4. 类图关系 1. 设计顶层接口 // 定义为一个泛型接口,提供给抽象类使用 public interface Cach…...

Django部署时静态文件配置的坑

Django部署时静态文件配置配置的坑 近期有个需求是用django进行开发部署&#xff0c;结果发现静态文件配置的坑是真的多&#xff0c;另外网上很多的内容也讲不清楚原理&#xff0c;就是这样这样&#xff0c;又那样那样&#xff0c;进了不少坑&#xff0c;这里记录一下关于css,…...

Android---网络编程优化

网络请求操作是一个 App 的重要组成部分&#xff0c;程序大多数问题都是和网络请求有关。使用 OkHttp 框架后&#xff0c;可以通过 EventListener 来查看一次网络请求的详细情况。一次完整的网络请求会包含以下几个步骤。 也就是说&#xff0c;一次网络请求的操作是从 DNS 解析…...

《算法通关村——不简单的字符串转换问题》

《算法通关村——不简单的字符串转换问题》 8. 字符串转换整数 (atoi) 请你来实现一个 myAtoi(string s) 函数&#xff0c;使其能将字符串转换成一个 32 位有符号整数&#xff08;类似 C/C 中的 atoi 函数&#xff09;。 函数 myAtoi(string s) 的算法如下&#xff1a; 读入…...

给VSCode插上一双AI的翅膀

#AI编程助手哪家好&#xff1f;DevChat“真”好用# 文章目录 前言一、安装DevChat1.1、访问地址1.2、注册1.3、在VSCode里安装DevChat插件1.3.1、未安装状态1.3.2、已安装状态 二、设置Access Key2.1. 点击左下角管理&#xff08;“齿轮”图标&#xff09;—命令面板&#xff…...

2023年亚太杯数学建模思路 - 案例:异常检测

文章目录 赛题思路一、简介 -- 关于异常检测异常检测监督学习 二、异常检测算法2. 箱线图分析3. 基于距离/密度4. 基于划分思想 建模资料 赛题思路 &#xff08;赛题出来以后第一时间在CSDN分享&#xff09; https://blog.csdn.net/dc_sinor?typeblog 一、简介 – 关于异常…...

【开题答辩全过程】以 校园超市购物系统为例,包含答辩的问题和答案

个人简介一名14年经验的资深毕设内行人&#xff0c;语言擅长Java、php、微信小程序、Python、Golang、安卓Android等开发项目包括大数据、深度学习、网站、小程序、安卓、算法。平常会做一些项目定制化开发、代码讲解、答辩教学、文档编写、也懂一些降重方面的技巧。感谢大家的…...

RK806与RK3588的电源设计最佳实践:如何优化BUCK和LDO布局布线

RK806与RK3588电源设计实战指南&#xff1a;从BUCK到LDO的全面优化策略 在嵌入式系统设计中&#xff0c;电源管理往往是最容易被忽视却又至关重要的环节。RK3588作为一款高性能处理器&#xff0c;其稳定运行高度依赖于RK806电源管理芯片的精准供电。我曾参与过多个采用这套方案…...

Vue3+monaco-editor实战:如何让代码编辑器完美适应侧边栏折叠?

Vue3与monaco-editor深度整合&#xff1a;动态布局的工程化实践 侧边栏折叠交互已成为现代Web应用的标配功能&#xff0c;但当这种动态布局遇上代码编辑器这类复杂组件时&#xff0c;开发者往往会遇到布局错位、滚动条异常等顽固问题。本文将分享在Vue3项目中实现monaco-editor…...

Harmonyos应用实例233:数独逻辑教练 (综合与实践)

5. 数独逻辑教练 (综合与实践) 功能介绍: 提供一个 4x4 或 6x6 的入门级数独游戏,专为训练逻辑推理设计。系统随机生成题目,用户点击格子填入数字。如果填入错误,系统会给予红色高亮提示。包含“提示”功能,自动填入一个正确数字,帮助学生理解排除法和唯一性原理。 //…...

Captura视频质量优化终极指南:先降噪后锐化的完美工作流

Captura视频质量优化终极指南&#xff1a;先降噪后锐化的完美工作流 【免费下载链接】Captura Capture Screen, Audio, Cursor, Mouse Clicks and Keystrokes 项目地址: https://gitcode.com/gh_mirrors/ca/Captura Captura是一款功能强大的屏幕录制工具&#xff0c;支持…...

为什么你的Python 3.14 JIT始终未触发?揭开__pycache__/jit_profile.bin隐藏机制与企业级profile引导策略(仅3家头部云厂商公开的冷启动预热方案)

第一章&#xff1a;Python 3.14 JIT 编译器的演进逻辑与企业级定位Python 3.14 引入的原生 JIT&#xff08;Just-In-Time&#xff09;编译器并非对 CPython 的简单性能补丁&#xff0c;而是基于多年运行时分析与生产环境反馈重构的执行引擎。其核心演进逻辑聚焦于“渐进式优化”…...

ResNet50实战:用Fruits-360数据集训练自己的水果分类模型(附完整代码)

ResNet50实战&#xff1a;用Fruits-360数据集训练自己的水果分类模型&#xff08;附完整代码&#xff09; 在计算机视觉领域&#xff0c;图像分类是最基础也最实用的任务之一。无论是工业质检、医疗影像分析还是零售商品识别&#xff0c;都需要可靠的分类模型作为支撑。而水果分…...

STM32 HAL库里Systick中断优先级设成0x0F,你的定时器还准吗?

STM32 HAL库中Systick中断优先级设置对定时精度的影响与优化实践 在嵌入式开发领域&#xff0c;定时精度往往直接影响着系统性能与稳定性。许多开发者在使用STM32 HAL库时&#xff0c;可能从未深入思考过Systick中断优先级设置对系统定时精度的影响。本文将揭示一个容易被忽视但…...

HDMI音频传输实战:手把手教你解析Data Island Packet里的Audio Sample与ACR包

HDMI音频传输实战&#xff1a;从Data Island Packet解析到问题排查 HDMI作为现代音视频传输的核心接口&#xff0c;其音频传输机制一直是工程师调试过程中的"黑匣子"。当遇到无声、杂音或时钟不同步等问题时&#xff0c;传统方法往往依赖设备厂商提供的调试工具&…...

Millennium Steam Patcher架构解析:模块化主题引擎与Hook系统的深度实现

Millennium Steam Patcher架构解析&#xff1a;模块化主题引擎与Hook系统的深度实现 【免费下载链接】millennium-steam-patcher Apply themes/customize Steam after the 2023-04-27 Chromium UI update https://discord.gg/MXMWEQKgJF 项目地址: https://gitcode.com/gh_mi…...