Javascript Snippet to Add HTML, CSS, and FEED Validation Links

Here's an example of validation links from the AskApache footer.

RSS | XHTML 1.1 | CSS 2.1

document.getElementById("validat").innerHTML += ' | RSS  | XHTML 1.1 | CSS 2.1';

Main Javascript Object

Now here's the object that contains all the functions and variables. This is smart to do as a function (all javascript really) because it makes it much safer as it won't conflict with other scripts or having naming collisions. And portable code is always something to strive for.

var AskApacheJS = new Object({

	/* Runs on page load.  Initializes ajs as being an alias for AskApacheJS,
	* and runs the append_validation_links function after 5 seconds. */
	_init: function () {
		/*console.log('Running _init');*/
		window.ajs = this;
		setTimeout(ajs.append_validation_links, 5000);
	},


	append_validation_links: function () {
		var ac=ajs.gi('validatelinks');

		if(ac) {
			var url=encodeURI(window.location).toString().replace(/&/g,"&");

			ac.innerHTML =
			  " | "
			+ " | "
			+ " | "
			+ " | "
			+ " | "
			+ "";
		}
	},

	/* gi stands for get item, and returns an element by id. Very robust: if it cant find the object it logs to the console. */
	gi: function (B) {
		/*console.log('Running gi '+B);*/
		try {var b = document.getElementById(B);}
		catch(e1) {b = null;try {b = document.all(B);}
		catch(e2) {b = null;try {b = document.layers[B];}
		catch(e3) {b = null;}}}
		return (ajs.isobj(b)) ? b : ajs.er("ERR gi " + B);
	},

	/* This function writes the passed msg to the console as type 'error'
	*  and then returns false since it was afterall an error. */
	er: function (msg) { console.error(msg); return false; },

	/* Returns true or false based on whether the passed item was an object, used by gi. */
	isobj: function (_1e) { return (typeof _1e != "undefined" && typeof _1e === "object") ? true : false;	}
});

Initialize the Object

;(function () {
	if (!window.ajs)var ajs=AskApacheJS;window.ajs=ajs=AskApacheJS;
	try{ajs._init();}catch(e){AskApacheJS._init();}
})();

FireBug Logging

First things first, this sets up all the logging and debugging needed. This lets you control debugging output displayed in the console used by debuggers like FireBug. Add this to the very top of your javascript.

if(!this["console"]){this.console = {};}
var i=0,tn,cn=["assert","count","debug","dir","dirxml","error","group","groupEnd","info",
"profile","profileEnd","time","timeEnd","trace","warn","log"];
while ((tn = cn[i++])) {
	if (!console[tn]) {
		(function () { var a = tn + "", console[a] = ("log" in console) ?
		function(){var a=tn+"";console[a]=("log" in console) ?
		function(){var b=Array.apply({},arguments);b.unshift(a+":");
		console["log"](b.join(" "))} : function(){}})()
	}
};

Turning On/Off Debugging

It's useful to quickly be able to switch between having the console logging turned on or off. The downside to keeping it on of course is overhead. Here's a very simple method that I use, advanced users use more sophisticated methods than this. Here are the regexes (Adobe CS4 DreamWeaver).

# To turn console logging on
Search for: /*console.log([^;]*);*/
Replace with: console.log$1;

# To turn console logging off
console.log([^;]*);
/*console.log$1;*/

Console Logging Commented Out

Here's an example of howto log the isobj function from the above object. isobj: function (_1e) { /*@console@*console.log('Running isobj ');**@console@*/ return (typeof _1e != ajs.undefined && typeof _1e === "object") ? true : false; },

Quick and Easy Example

	document.getElementById('validatelinks') && document.getElementById('validatelinks').innerHTML =
			  " | "
			+ " | "
			+ " | "
			+ " | "
			+ " | "
			+ "";