CODEWITHSUNDEEP
javascripthtml
Daniel Christensen
Daniel Christensen

Reputation: 17

Javascript redirect on date of site

guys. I am currently making a website but I want to make so my site redirects to the day of the week automatically instead of needing to press the link. Example : If its monday the site will redirect to monday.html.

My code : 

<!DOCTYPE -be sure to use one of these! 
<html> 
<head> 
<title></title> 
<script type="text/javascript"> 
window.onload = function(){chgDailyImg();} 
function chgDailyImg() 
{ 
var imagearray = new Array(); 
imagearray[0] = "sundaypic.png"; 
imagearray[1] = "mondaypic.png"; 
imagearray[2] = "tuesdaypic.png"; 
imagearray[3] = "wednesdaypic.png"; 
imagearray[4] = "assets/images/thursdaypic.png"; 
imagearray[5] = "fridaypic.png"; 
imagearray[6] = "saturdaypic.png";

var linkarray = new Array(); 
linkarray[0] = "sondag.html"; 
linkarray[1] = "mandag.html"; 
linkarray[2] = "tirsdag.html"; 
linkarray[3] = "onsdag.html"; 
linkarray[4] = "torsdag.html"; 
linkarray[5] = "fredag.html"; 
linkarray[6] = "lordag.html";

var textarray = new Array(); 
textarray[0] = "This is sunday's text - click to go to sunday's page"; 
textarray[1] = "This is monday's text - click to go to monday's page"; 
textarray[2] = "This is tuesday's text - click to go to tuesday's page"; 
textarray[3] = "This is wednesday's text - click to go to wednesday's page"; 
textarray[4] = "Torsdag"; 
textarray[5] = "This is friday's text - click to go to friday's page"; 
textarray[6] = "This is saturday's text - click to go to saturday's page";

var d = new Date(); /*** create a date object for use ***/ 
var i = d.getDay(); /*** use the date object to get the day of the week - this will be a number from 0 to 6 - sunday=0, saturday=6 -it's the way counting works in javascript it starts at 0 like in the arrays ***/ 
document.getElementById("dailyImg").src = imagearray[i]; 
document.getElementById("dailyLink").href = linkarray[i]; 
document.getElementById("dailyLink").innerHTML = textarray[i]; 
} 
</script> 
</head> 
<body> 
<div> 
<a href="sundaypage.html" id="dailyLink">This is sunday's text - click to go to sunday's page</a> 
<img src="sundaypic.jpg" alt="daily pic" title="daily pic" width="300" height="100" id="dailyImg" /> 
</div> 
</body> 
</html>

Upvotes: 0

Views: 160

Answers (4)

Jose CC
Jose CC

Reputation: 866

I thing the best way to do this, is by making everything dynamic.

var days = ['sunday', 'monday', 'tuesday', 'wednesday', 'thursday', 'friday', 'saturday'];
 var d = new Date();
 var n = d.getDay()

var todaysDate = days.filter(function(day,index){
    return index === n;
});
window.location.href = todaysDate.toString()+'pic'+'.png';

Upvotes: 0

user6366379
user6366379

Reputation: 

function redirectday() {
    switch (new Date().getDay()) {
    case 0:
        window.location = "sunday.html";
        break;
    case 1:
        window.location = "monday.html";
        break;
    case 2:
        window.location = "tuesday.html";
        break;
    case 3:
        window.location = "wednesday.html";
        break;
    case 4:
        window.location = "thursday.html";
        break;
    case 5:
        window.location = "friday.html";
        break;
    case 6:
        window.location = "saturday.html";
}
}
<body onload="redirectday();">
</body>

The getDay() method returns the day of the week (from 0 to 6) for the specified date.

Note: Sunday is 0, Monday is 1, and so on. https://www.w3schools.com/jsref/jsref_getday.asp

Upvotes: 0

nusje2000
nusje2000

Reputation: 503

switch ((new Date()).getDay()) {
    case 0:
        window.location.replace(window.location.origin + "/sunday.html");
        break;
    case 1:
        // mon, thu, wens etc...
        break;
}

I think this should be the solution

Upvotes: 0

Obsidian Age
Obsidian Age

Reputation: 42304

All you need to do is set window.location.href to linkarray[i] instead of writing it to the page:

<!DOCTYPE html>
<html>

<head>
  <title></title>
  <script type="text/javascript">
    window.onload = function() {
      chgDailyImg();
    }

    function chgDailyImg() {
      var imagearray = new Array();
      imagearray[0] = "sundaypic.png";
      imagearray[1] = "mondaypic.png";
      imagearray[2] = "tuesdaypic.png";
      imagearray[3] = "wednesdaypic.png";
      imagearray[4] = "assets/images/thursdaypic.png";
      imagearray[5] = "fridaypic.png";
      imagearray[6] = "saturdaypic.png";

      var linkarray = new Array();
      linkarray[0] = "sondag.html";
      linkarray[1] = "mandag.html";
      linkarray[2] = "tirsdag.html";
      linkarray[3] = "onsdag.html";
      linkarray[4] = "torsdag.html";
      linkarray[5] = "fredag.html";
      linkarray[6] = "lordag.html";

      var textarray = new Array();
      textarray[0] = "This is sunday's text - click to go to sunday's page";
      textarray[1] = "This is monday's text - click to go to monday's page";
      textarray[2] = "This is tuesday's text - click to go to tuesday's page";
      textarray[3] = "This is wednesday's text - click to go to wednesday's page";
      textarray[4] = "Torsdag";
      textarray[5] = "This is friday's text - click to go to friday's page";
      textarray[6] = "This is saturday's text - click to go to saturday's page";

      var d = new Date(); /*** create a date object for use ***/
      var i = d.getDay(); /*** use the date object to get the day of the week - this will be a number from 0 to 6 - sunday=0, saturday=6 -it's the way counting works in javascript it starts at 0 like in the arrays ***/

      // Automatically redirect to the day's page
      window.location.href = linkarray[i];
    }
  </script>
</head>

</html>

Hope this helps! :)

Upvotes: 1

Related Questions