HTML how do I insert dynamic date in webpage

Question

I have a static webpage, nothing changes dynamically. However the client wants a date insert into text within the page. The date will always be the current daet plus one day. how do I do that?

Answer 1

Use JavaScript and insert the date onLoad.

Take a look here for a working example: http://jsfiddle.net/xGDvp/

This will update the date as follows: February 5, 2011

Your HTML:

<span id="spanDate"></span>

Your Javascript

    <script type="text/javascript">
           var months = ['January','February','March','April','May','June','July',
'August','September','October','November','December'];       
var tomorrow = new Date();
tomorrow.setTime(tomorrow.getTime() + (1000*3600*24));       
document.getElementById("spanDate").innerHTML = months[tomorrow.getMonth()] + " " + tomorrow.getDate()+ ", " + tomorrow.getFullYear();
    </script>

Answer 2

^{Downvoters: Note that the tag "javascript" was added after this answer was given.}

You could use Server Side Includes (SSI), if your server supports them.

If your server is Apache, you could, for example, put the following element into your HTML page to output a current date + 1 day:

<pre>
<!--#exec cmd="date -v +1d '+DATE: %Y-%m-%d'" -->
</pre>

Assuming today is 2011-02-05, you'll have the following output on your page in browser:

...
DATE: 2011-02-06
...

To output the full weekday name, you can use date -v +1d '+DATE: %A %d, %Y', which gives you DATE: Sunday 06, 2011.

---

Further reading:

• article Server Side Includes at Wikipedia
• Apache Tutorial: Introduction to Server Side Includes
• date(1) manual page at FreeBSD.org

Answer 3

window.onload = initDate;
function initDate() {
     var dayName = new Array("Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday","Saturday");
     var monName = new Array("January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December");
     var now = new Date();
     var dtString = dayName[now.getDay()] + ", " + monName[now.getMonth()] + " " + now.getDate();
     document.getElementById("dtField"). innerHTML = dtString;
}

Source

Answer 4

If your not opposed to PHP, then you could do something like this... Also Tizag.. http://www.tizag.com/phpT/phpdate.php

<?php
$todayPlusADay = mktime(0, 0, 0, date("m"), date("d")+1, date("y"));
echo "Todays Date Plus One Day (Tomorrow) ".date("m/d/y", $todayPlusADay); 
?>

Quick search for "php echo date + 1 day" produced that little diddy :) That could certainly be expanded upon to any extent just about.

Answer 5

You could use javascript to insert the date somewhere in the page:

<script type="text/javascript">
var newDate = new Date();
newDate.setDate(newDate.getDate() + 1);

//insert it via jquery
$('#displayDate').html((newDate.getMonth() + 1) + '/' + newDate.getDate() + '/' + newDate.getFullYear());

//or insert it via javascript
document.getElementById('displayDate').innerHTML = (newDate.getMonth() + 1) + '/' + newDate.getDate() + '/' + newDate.getFullYear();

</script>

and the html:

<span id="displayDate"></span>

test it here: http://jsfiddle.net/9xWUT/

Answer 6

I recommend XDate because it will save a lot of typing. Also, please don't use innerHTML, it's such a bad habit. I just did the same on a web page and the key thing was to use inline javascript beneath the tag you are updating although you can use 'onload' as well.

In the page I add the tag and put in some default info just because:

<p>Today is <span id="todays_date" style="font-style: italic;">November 1, 2015</span></p>

With this below that:

<script type="text/javascript">
  var today = new XDate();

  document.getElementById("todays_date").innerHTML = "";

  document.getElementById("todays_date").appendChild(document.createTextNode(today.toString("MMMM d, yyyy")));
</script>

NB: I do use innerHTML to quickly obliterate nested tags rather than a recursive "delete all children" because that's in a different library and not pertinent to this example.

See http://arshaw.com/xdate/