怎么用html5存储用户输入的信息

当我们开发网页时，我们经常使用数据库来存储用户输入的信息。但是数据库安装配置复杂，不适合一些简单的需求。下面的小系列就和大家分享一下如何用html5快速存储信息。

需要准备的物品

升华文本

详细介绍方法/步骤

先打开升华文字软件。在html界面中，我们使用html5语言来布局一些输入框供用户输入信息，如下图所示

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

然后我们获取用户在脚本标签中输入的信息，并通过localstorage对象将其存储在本地，如下图所示

为了实现信息搜索，编写了以下功能。这里的信息主要通过localstorage的getitem方法获取，如下图所示

，然后我们以列表的形式显示html5中存储的所有信息，如下图所示

接下来，我们运行页面程序，在输入框中输入您想要添加的数据，只需在这里输入一些测试数据，然后添加记录按钮，如下图所示

当我们添加记录时，我们将在列表中看到我们添加的信息，它以键值对的形式存储，如下图所示

比较后，在搜索输入框中，我们输入键得到相应的值，如下图所示