Numeriska värden och lokal lagring med HTML5

April 24

Med HTML5, kan du skriva upp till 5 MB data till en särskild local fil på klientdatorn. Alla sidor som kommer från din domän delar samma lagringsområde, så du kan använda denna mekanism för att hålla uppgifter ihållande mellan flera sidor. Data stannar också på klientdatorn (tills du tar bort den), så det kan användas för att hålla reda på information över tiden.

Om du arbetar med numeriska data, kom ihåg att local lagrar allt som en sträng. Det är inga problem att lagra ett numeriskt värde i local, men när du hämtar det, måste du konvertera värdet till ett numeriskt värde (med parseInt () eller parseFloat ()) till datatypen du behöver. Här är ett exempel som räknar antalet gånger en användare har besökt din webbplats:

funktions countVisits () {
str_count = localStorage.getItem ("räkna");
// Få ett numeriskt värde från str_count, lägga den i räkningen
if (str_count == null || str_count == "null") {
count = 0;
} Else {
count = parseInt (str_count);
} // End if
// Inkrement räknevärdet
räkna ++;
// Display count
lblCounter = document.getElementById ("lblCounter");
lblCounter.innerHTML = "Du har varit här" + räkna + "tider";

// Lagra räknevärdet
localStorage.setItem ("räkna", räkna);
} // End count

Denna kod skulle behöva köra varje gång sidan laddas (kanske med <body onload> attribut).

  1. Försök att få räkningen från localStore.

    Använd str_ prefixet för att påminna dig om att data är idag en sträng.
  2. Säkerställ att det finns värdet.

    Om det inte finns någon post i databasen för räkningen, måste detta vara första gången användaren är här (eller de har rensat databasen). I endera fallet, tilldela värdet 0 för att räkna (som är en numerisk variabel).
  3. Om str_count existerar, konvertera den till ett heltal.

    Använd parseInt () för att konvertera strängen str_count in heltalet räkna.
  4. Lägg en att räkna.

    Nu när räkningen är ett heltal, kan du lägga till den.
  5. Visa räknarvärdet för användaren.

    Naturligtvis är detta inte absolut nödvändigt, men det är trevligt att ge lite feedback.
  6. Store räkna tillbaka till local databasen.

    Observera att du kan lagra heltal räkna till databasen utan problem. Det kommer att lugnt omvandlas till en sträng när den lagras.