It seems trivial, and it is, but if you are going to write a cross browser script, you can find that sometimes (i.e. always) most used browsers, Firefox and Internet Explorer, work in different ways...damn it!
One of those troubles is the
class attribute of a generic HTML; I found that in IE you cannot simply set a
class attribute to your own HTML node, but you have to set a
className node with the list of your CSS classes.
This is THE code:
/* find out which is the browser */
var isIE = (window.ActiveXObject)?true:false;
var isMozilla = (document.implementation.createDocument)?true:false;
/* the name of the attribute, depending on the browser */
var attributeClass = (isIE)?"className":"class";
/* set the attribute */
htmlNode.setAttribute(attributeClass,"classX dummyClass");
Moreover there is also another strange behavious as for the
style attribute; if you want to set the whole CSS text of a node's style (and not a particular sub attribute), this is the syntax:
[UPDATE 01 feb. 2008 - 17:50]
Max and other users made me notice that "else if(isMozilla)" may exclude other
kind of browser, not allowing a wide "cross browsering". Thanx guys!
var styleString ="font-size:10px;";
if(isIE)
div.style.cssText=styleString ;
else //if(isMozilla)
div.setAttribute("style",styleString);
I assure you: writing cross browser script is a really butchery task! Try if you don't believe me!