- HTML5 Web Application Development By Example Beginner's Guide
- J.M. Gustafson
- 271字
- 2021-08-13 16:50:22
Time for action – loading the tasklist
We have the tasklist saved. But that doesn't do us much good if we can't load it. So let's add a new private method called loadTaskList()
:
function loadTaskList() { var tasks = appStorage.getObject("taskList"); if (tasks) { for (var i in tasks) { addTaskElement(tasks[i]); } } }
This method calls appStorage.getValue()
passing in the key for our tasklist. Then it checks to make sure we got something back. If so, it iterates over all of the tasks in the array calling the addTaskElement()
method for each one.
The only thing left to do is add a call to loadTaskList()
from the start()
method, so the list is loaded when the application starts:
this.start = function()
{
// Code not shown…
loadTaskList();
setStatus("ready");
};
What just happened?
We used the AppStorage
object in our tasklist application to store the tasklist to localStorage
any time something changes, and then retrieve it and build the tasklist when the user returns.
Have a go hero
Write a local storage browser application that can be used to look at the data for each application in your domain. At the top level, list all of the applications. When you drill down into the application, it shows all of its local storage items. When you click an item, it shows the contents of that item.
Pop quiz
Q1. What are the three basic components of an HTML5 application?
- jQuery, templates, and local storage
- Document, object, and model
- Tags, elements, and attributes
- HTML, CSS, and JavaScript
Q2. What type of data can be stored in local storage?
- Any type
- Objects
- Numbers
- Strings
- Bootstrap Site Blueprints Volume II
- C#程序設計實訓指導書
- NumPy Essentials
- 機械工程師Python編程:入門、實戰與進階
- Expert Android Programming
- Java性能權威指南(第2版)
- Visual FoxPro程序設計習題集及實驗指導(第四版)
- SQL 經典實例
- iOS自動化測試實戰:基于Appium、Python與Pytest
- 機器學習微積分一本通(Python版)
- Visual Studio Code 權威指南
- Unity 2018 Augmented Reality Projects
- Python Machine Learning Blueprints:Intuitive data projects you can relate to
- Hadoop大數據分析技術
- Ext JS 4 Plugin and Extension Development