第 8 章:数据存储
1. 阅读参考资料
2. localstorage 状态保持
- 在 spa 仓库创建 61-store-clicking
- 用 localstorage 保存按钮点击的次数
- 页面上按钮的文字中显示被点击的次数
- 测试程序,点击按钮,检查点击次数,刷新页面,看点击数是否清零
示例参考:
3. localstorage 保存图片
- 在 spa 仓库创建 62-store-image
- 页面上文本框中输入图片的 URL 地址
- 点击保存按钮,将图片保存到 localstorage 中,并显示在页面上
- 测试程序,点击保存按钮,检查页面上是否有图片
- 刷新页面,看页面上的图片是否存在
示例参考:
4. history 状态保持
- 在 spa 仓库创建 63-click-history
- 用 history 保存按钮点击的次数
- 页面上按钮的文字中显示被点击的次数
- 测试程序,点击按钮,检查点击次数,刷新页面,看点击数是否清零
- 点击浏览器的导航键,前进、后退,观察按钮文字的变化
示例参考:
5. jsnotepad 状态保持
基本要求:
- 保存 jsnotepad 应用的状态,用户下次访问应用时,能够恢复到上次退出时的状态
- 状态包括:
- 编辑器中的文本内容
- 编辑器中的文本字体、样式、字号
- 编辑器中光标的位置
- 编辑器是否换行
- 是否显示状态栏
6. jsnotepad 文件菜单功能
基本要求:
- 实现 jsnotepad 文件菜单下各菜单项的相应功能
- 菜单项的功能参考 win10 的记事本程序
- 测试 jsnotepad