位置:首页游戏数码>如何用HTML5存储用户输入的信息 html5的web存储

如何用HTML5存储用户输入的信息 html5的web存储

所属分类:游戏数码 发布时间:2025/8/17 0:14:45

我们平时进行网页开发的时候,经常使用数据库存储用户输入的信息。但是数据库安装配置比较复杂,对于一些简单的需求并不适合。下面小编就给大家分享用HTML5快速存储信息的方法。

工具/材料

Sublime Text

操作方法

01

首先打开Sublime Text软件,在HTML界面中我们用HTML5语言布局一些输入框供用户输入信息,如下图所示

02

接下来我们在编写查找用户输入信息的界面,如下图所示,只需要一个输入框和一个按钮即可

03

然后我们在script标签中获取用户输入的信息,并且通过localStorage对象进行本地存储,如下图所示

04

下面实现信息查找的功能编写,这里主要是通过localStorage的getItem方法进行信息获取的,如下图所示

05

然后我们通过列表的形式将HTML5存储的信息都展示出来,如下图所示

06

接下来我们运行页面程序,在输入框里面输入你要添加的数据,这里简单的输入一些测试数据,然后点击新增记录按钮即可,如下图所示

07

当我们新增记录以后,就会在列表中看到我们增加的信息了,它是以键值对的形式存储的,如下图所示

08

最后在查找输入框里面我们输入键就会得到相应的值,如下图所示

推荐信息

  • 魅族6怎么强制关机 魅族怎么强制关机手机

    游戏数码时间:2025/8/24 19:54:58

    魅族6可以说是一款比较优秀的手机,那么大家知道魅族6怎么强制关机吗?接下来这篇指南将告诉你答案。操作方法01在使用魅族6的过程中难免会遇到手机故障问题,想要重启却无法强制关机,这里给大家总结了几个强制关机的方法。02最简单的就是长按电源键,一般按住五秒以上手机就可以强制关机了。03如果长按电源键的方

  • 苹果机如何查看iTunes备份数据中的微信聊天记录 苹果机如何查看qq浏览过的视频

    游戏数码时间:2025/8/24 18:25:19

    就在前几天五一假日期间,小编一朋友在外出旅游时不知道是自己不小心掉了还是被小偷给偷走了。回来之前伤心得不得了,因为手机里有很多重要的信息。特别是微信里有很多重要的内容。但是怎么办呢?这朋友于是找到小编告诉我说他以前在电脑上使用iTunes有过备份。看有没有什么办法能将里面有微信记录给他弄出来。操作方

  • cad自动保存在哪里?cad自动保存路径图解 cad自动保存在哪找到

    游戏数码时间:2025/8/17 16:15:44

    自动保存可以把因意外关闭而没有保存的文件找回来,很多小伙伴不知都怎么找到自动保存的文件存放在电脑的什么位置,下面来看怎么找到自动保存的文件位置。工具/材料cad操作方法01首先我们在打的cad文件中点击菜单栏中的工具选项卡,然后点击最下方的选项。02在打开的选项中我们点击文件然后在下方的搜索文件和保

  • 教你把mpg格式视频转换为mp4格式 mpg格式视频怎么转到微信

    游戏数码时间:2025/8/23 6:44:07

    今天小编要和大家分享的是如何把mpg格式视频转换为mp4格式,希望能够帮助到大家。操作方法01首先在我们的电脑桌面上找到视频编辑专家并点击它,如下图所示。02然后点击编辑与转换,如下图所示。03接着点击添加文件,如下图所示。04然后双击我们要转换格式的视频,如下图所示。05接着选择MP4格式并点击确

  • Notepad++使用技巧 notepad使用教程图解

    游戏数码时间:2025/8/20 13:07:22

    Notepad++是一款代码文本编辑器,它可以编辑和对代码进行注释,功能非常的强大,所以下面给大家介绍一下Notepad++使用技巧。请看下面操作方法01快捷键设置,很多时候我们都习惯使用快捷键来提高工作效率,而Notepad++代码文本编辑器的快捷功能设置很好的满足了用户的需求。02编程语言,No

  • 安卓模拟器Root教程 手游模拟器root

    游戏数码时间:2025/7/8 7:14:02

    现在各类模拟器不断的发布,为手机游戏增加了新的开启方式,在模拟器上面可以完成许多手机不能完成的动作,我们来看看怎么root模拟器吧。操作方法01随着吃鸡手游的发布,安卓模拟器一抓一大把,在这里就不一一阐述了,本文以逍遥模拟器为代表做介绍。02下载好逍遥模拟器安装在电脑上,双击打开运行,设置好后就是如

  • 小鸡吃鸡王座如何使用 魔性吃鸡王座使用教程

    游戏数码时间:2025/8/23 9:01:39

    小鸡吃鸡王座是一个为吃鸡手游而生的硬件产品,那么大家知道小鸡吃鸡王座应该如何使用吗?接下来请跟随这篇指南来一探究竟。操作方法01首先我们要做好准备工作,下载好吃鸡手游,准备小鸡吃鸡王座和鼠标键盘,然后就可以进行下一步。02将手机架在小鸡吃鸡王座上,并且调整合适的角度,然后将鼠标和键盘的数据线插在小鸡

  • MI 小米智能插座 安装使用指南 小米智能插座安装视频

    游戏数码时间:2025/8/24 18:25:38

    小米生态链企业推出了许多的智能产品,小米智能插座就是其中之一,那么大家知道小米插座如何安装使用吗?接下来这篇指南将告诉你答案。操作方法01小米智能插座使用起来非常简单,拆开包装之后,插到插座上就可以使用了,当亮灯之后就说明小米智能插座已经处于通电状态了。02使用小米智能插座之前,我们需要下载米家AP

  • 一台功放一只音箱如何连接能达到更大声的方法 一个功放接一个音箱怎么接

    游戏数码时间:2025/8/15 2:45:09

    现在很多人喜欢用音箱放音乐来制造一种活跃气氛。那么怎样用一台功放一只音箱让声音达到更大呢?操作方法01左右两声道输出端同时接一个音箱,在实际联接中,无论你怎么接,只要和符合原则,不管是串联、并联都行。02然后了解一下音箱串联并联阻值变化情况。如果音箱阻值是16欧姆,所以两个这样的音箱并联后阻值就变成

  • 怎样在电脑上玩刺激战场手游(无需模拟器) 怎样用电脑玩刺激战场

    游戏数码时间:2025/8/22 12:37:53

    吃鸡游戏正在手游市场上大火,尤其是刺激战场,可以说是吃鸡手游的中流砥柱。那么,很多人就有了在电脑大屏上玩刺激战场手游的需求。有些人选择用安卓模拟器,但安卓模拟器对电脑配置要求很高,一般人电脑吃不消。而且使用安卓模拟器会和手游的服务器不同步,不能在同一个区玩,这一点很不方便。今天介绍一种不用改变服务器