Question 44963 in Html Question posted in
Some basic documentation can be found here.

Using local storage to calculate number of days since last visit to site – Html

I have been assigned to display to the user the number of days since their last visit to my website and have to use the "localStorage" web api. I believe I have a good start, and I know that I will need to access and store the last visit date and get the difference between the current date of their visit. I am just unsure of how to access the date of their last visit.

Here is my code:

HTML:

<article>Days since your last visit:<span class="timeBetween"></span></article>

The class name of the span I want to display to is "timeBetween"

JavaScript:

const visitsDisplay = document.querySelector('.timeBetween');

let numVisits = Number(window.localStorage.getItem("timeBetween"));

//This is where I believe I need to get the days between visits
//Something like:

const visitDifference = "pastvisit" - Date.now();

localStorage.setItem("timeBetween", visitDifference);
Tags:

3

Answers


  1. 0

    I think the flow should be like below:

    if(localStorage.getItem("lastVisited")==null){
    // consider first visit
    localStorage.setItem(new Date()) // your choice of format
}
else{
    const lastVisited = localStorage.getItem("lastVisited")
    // your logic to calculate days based on format stored.
    localStorage.setItem(new Date()) // current visit for future calculation
}
    Login or Signup to reply.
  2. 0

    you should save the current Time when user opens your site every time

    localStorage.setItem("lastVesitedTime", JSON.stringify(new Date()));

    and where you are displaying the difference of last visited time and current time

    var time = localStorage.getItem("lastVesitedTime");
var lastVisitedTime = JSON.parse(time);
var now =new Date();
var diffDays =now.getDate() - lastVisitedTime.getDate(); 
const visitsDisplay = document.querySelector('.timeBetween');
visitedDisplay.innerText=diffDays + " days"
    Login or Signup to reply.
  3. 0

    Since you want to calculate the number of days between the visitor’s last visit, you could use something like this (could be polished and improved, but it works)

    <article>Days since your last visit: <span class="daysSinceLastVisit"></span></article>

    // Somewhere else in your code base set the last visit in localStorage
localStorage.setItem('lastVisit', '2023-02-22');

displayDaysSinceLastVisit();

function displayDaysSinceLastVisit() {
  const visitsDisplay = document.querySelector('.daysSinceLastVisit');

  const lastVisit = localStorage.getItem('lastVisit');

  if (!lastVisit) {
    visitsDisplay.innerText = 'This is your first visit';
    
    return;
  }

  const lastVisitDate = Date.parse(lastVisit);
  
  if (!lastVisitDate) {
    // Stored date is not a valid format
    return;
  }

  const currentDate = new Date();

  const difference = currentDate - lastVisitDate;
  const differenceInDays = Math.floor(difference / (1000 * 60 * 60 * 24));

  visitsDisplay.innerText = differenceInDays;
}
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search