I had been wrestling with this a couple of days ago, and thought it might be nice to share. You see, not only does Internet Explorer (all versions through 7 at least) mangle CSS, but seems to have a special interest in making Javascript applications exceedingly difficult as well. Mainly, it takes any code provided by Javascript’s innerHTML property and capitalizes all of the tags before spitting it back out in the desired element. This sounds harmless enough, but by my standards, IE should have no business rewriting my code. Therefore, I devised this little script, using a bit of Regular Expression goodness (» represents line breaks):
newElement.innerHTML = element.innerHTML.replace(/<.([A-Za-z]*[A-Za-z0-9]w*)?(?=.*>)/gi, » function(w) {return w.toLowerCase();});
Now that I had that solved, I had a new problem: IE runs a rather vague error when trying to place HTML in to <p> tags. Specifically it is an “Unknown Runtime Error”… specifically. Now, I know that innerHTML is not specified by W3C, and IE is probably just doing what it thinks is best, not allowing HTML in to a non-block level element, but what about an anchor tag, or a <strong> tag? Well, with a little help from the DOM, I came up with this:
// oldElement being the element you want to place HTML in to...
var replacement = new Element(oldElement.tagName);
// now, copy all of the attributes of newElement to replacement...
for(i=0; i<$oldElement.attributes.length; i++) {
replacement.setAttribute(oldElement.attributes[i].nodeName,» oldElement.attributes[i].nodeValue);
}
// put some code in to replacement...
replacement.innerHTML = "<a href='#'>Place some <strong>code here</strong>.</a>";
// and then pull the old switch-a-roo!
oldElement.parentNode.replaceChild(replacement, oldElement);
Well, you would think that would be enough to tame ol’ IE, but no: the folks at Microsoft have cooked up one more obstacle. All versions of IE that I have encountered will rewrite all relative urls to absolute urls on page load. I have yet to find an answer as to why, or how to stop it. This, again, crosses my ideal that the browser has no business rewriting my code, and makes for the handling of certain tasks very difficult. At this point, I throw myself on the mercy of our readers… any ideas?