I have been working on a help documentation system at work.
There are roughly 50,000 HTML files to deal with (yes 50 thousand).
The html files have a pretty decent structure, but they are by no means XHTML.
I dont have access to a web development language like php, cfm, for asp or this project to insert
to make life easier for myself, I had the authors of the help system insert a single line into the head of each HTML file.
Things looked great in FireFox. Life was good until I loaded the site into Internet Explorer.
IE isnt known for its script debugging (another reason to no use IE). It took me literally hours to track down the problem.
I was doing this for all the css files (4 of them)
var tmpElm = document.createElement("style"); tmpElm.setAttribute("type", "text/css"); tmpElm.appendChild(document.createTextNode("/some/directory/sweetness.css);")); document.getElementsByTagName('head').appendChild(tmpElm);
create a style element, add the right attribute to it, add value to the style tag, then append it to the page head.
straight forward stuff.
Like I said, FireFix had no problem with it. After doing tons of test, i realized that IE didnt like me appending a style tag to the head!
Then I found this:
IE won't allow document.createElement('style')
If you try to add style declarations in the head of a document, IE borks at the name 'style' – "unexpected call to method or property access".
IE gets confused between the head element <style> and the object property .style!
So I spend all that time debugging my code, which was perfectly fine, because IE is retarded and doesnt know the difference between <style> and .style!
I removed all that sweet un obtrusive code and used this instead:
document.write("<style type="text/css">@import url(/some/directory/sweetness.css");
I hate using document.write() these days, but it works in both IE and FF now.
My life sucks some times.