today is

August 3, 2012 12:52 PM

Website question, now to automatically change data based on current date

Is it possible via html or javascript to change text based on the current data? What would that script be? I do not want to use a database.

posted by wandering_not_lost to Computers & Internet (6 answers total)

Response by poster: I should have specified that I am interested in the text changing based on a date like May 5, or 5/5, not a day of the week.
posted by wandering_not_lost at 12:58 PM on August 3, 2012

This looks like it should get you on the way: Basic Javascript Date and Time Functions
posted by backwards guitar at 12:59 PM on August 3, 2012

Further, something along these lines:


<script type="text/javascript" language="JavaScript">
<!--
var hour = now.getHours();
var minute = now.getMinutes();
var second = now.getSeconds();
var monthnumber = now.getMonth();
var monthday = now.getDate();
var year = now.getYear();

if (monthnumber == 5 && monthday == 5) {
document.write("It's May 5th");
}
//-->
</script>

posted by backwards guitar at 1:03 PM on August 3, 2012 [1 favorite]

Gah, missed the first line:


var now = new Date();


should go above:

var hour = now.getHours();

posted by backwards guitar at 1:04 PM on August 3, 2012

It may be a pedantic note, but using a server-side language wouldn't necessarily mean you're using a database.
posted by RobotHero at 1:48 PM on August 3, 2012 [1 favorite]

I've done a meeelion of these over the years. How's this for a simple scheme:

<script>
var dateObj = new Date(), i, dateParts, dateId, dayString;
dateParts = [(dateObj.getMonth() + 1), (dateObj.getUTCDate())];
for (i = 0; i < dateParts.length; i++) {
    if (dateParts[i].toString().length === 1) {
        dateParts[i] = '0' + dateParts[i];
    }
}
dateId = 'date-' + dateParts.join("");
dayString = document.getElementById(dateId);
if (dayString) {
    dayString.style.display = 'block';
} else if (document.getElementById('date-else-test')){
   document.getElementById('date-else-test').style.display = 'block';
}
</script>

What this is does is create a scheme so that things that have the id like "date-MMDD" will get displayed. If there's no such thing, then a fallback will get displayed, if its available.

So for HTML like this:

<div>
<p id="date-0505" style="display: none;">May 5th thing</p>
<p id="date-0804" style="display: none;">For August 4</p>
<p id="date-0805" style="display: none;">This one's August fifth</p>
<p id="date-0806" style="display: none;">6 de Agosto</p>
<p id="date-0807" style="display: none;">7 AUG</p>
<p id="date-else-test" style="display: none;">Text on any other day</p>
</div>

Today, (August 4th where I am) "For August 4" displays.
posted by artlung at 1:12 PM on August 4, 2012