Improved Author Local Time

1. Introduction and Sample

My Author Time presents a discussion of the three timezones that are involved in a visitor viewing your web page (your time, the time on the server hosting your site, and the time where that visitor is located). That script calculates the time at your location from the time and timezone information on your visitor's computer and displays the time and the day of the week ay your location in the web page.

That script was first written many years ago and when I first wrote it I was far less familiar with Javascript than I am now. The script originally performed its own calculations to work out the time and what day of the week that it was. I would have liked to be able to display the date as well but couldn't figure out an easy way to determine it without making the script much larger. More recently the script was rewritten both to use a Javascript date object to simplify the calculation of the time and also to add functionality to allow the time to be updated in the page if your visitor stays on the page long enough. This would have easily allowed for the date to be added to what is being displayed but I didn't think of it at the time of updating the script.

One aspect of the script that wasn't updated from the way the original was the way that the script added its content into the web page. The script uses a document.write statement to write the original text into the page and an innerHTML call to update it when required. Now document.write requires Javascript in the body of the web page where you want the output from the script to appear and also requires that your web page be processed as HTML rather than XHTML.. Using innerHTML is a simple way of updating part of the content of the web page but using it does not update the currently defined model of the document so that it is not then possible to do further processing on a part of that updated content.

To resolve all of these issues I decided to do a major rewrite of the script so that it uses the proper Document Object Model calls to place the content into the page in the first place and to update it as required as well as allowing the date to be easily displayed as well. As the way that the script is attached into your web page is now so different from the original I decided to present it as a new script rather than as an update to the existing one. You may like to compare the code between the two scripts to see how document.write and innerHTML calls can be replaced by the proper DOM calls so as to allow the Javascript to be made completely separate from the HTML.

Here's the output that you get from this version of the author time script.

So let's Get the Script and then we can look at what we need to do to customize it for your timezone.