Add date text script

This script can insert text or HTML inside or beside any element, depending on when the element was created. A typical use of this would be to show "New" beside links that were created within the last few days. However, it extends this idea so that you can add content to a range of ages, for example, only to elements that were created between 5 and 10 days ago.

Note: if you have access to server side scripting, this script is better done using a server side script. However, this script is naturally accessible, so if you do not have access to server side scripting, you can use this script and keep a clean conscience.

It is a fully DOM based script, so as well as working with regular HTML, it will also work with XHTML documents served with the XHTML content type header. In non-DOM browsers, it falls back to showing a tooltip with the creation date. By being a DOM based script, it helps keep your document clean, so there is no need to litter it with a script call every time you want to create a 'NEW' image. It runs through the elements for you, and checks which ones need the extra content.

It is a flexible script with several options:

It can be applied to content that was created between a specific range of days previously
It can add either text or a DOM node (such as an image, or a span containing an image)
It can be applied to elements of a specific type, or a specific collection of elements
The content can be added at the start or end of the element, on the inside or outside of it
The elements can be selected from any frame or related window, not just the page the script is running in
It can be told to adjust for different timezones

To download the script(s), see the script license, and check details like browser compatibility, use the links on the navigation panel at the top of this page.

Demonstration

In this demonstration, the script will add a 'NEW' image into the end of all links created in the last 5 days, and it will add the words 'Not so new' before every link that is between 5 and 10 days old.

Code used in the demonstration:

<script type="text/javascript">
window.onload = function () {

	var foo = document.createElement('img');
	foo.setAttribute('src','new.gif');
	foo.setAttribute('alt','New');
	foo.style.marginLeft = '5px';
	addDateText(0,5,'a',2,foo);

	addDateText(5,10,document.getElementsByTagName('a'),0,'Not so new ');

};
</script>

Add date text script

Navigation

Site search

Site navigation

Details and download

Add date text script

Demonstration