Two and a half years ago, I released the first version of getElementsByClassName. With how web browsers has evolved since, I thought I’d release a real ultimate version, dated 2008. 
A feature most people don’t seem to know about is conditional compilation in Internet Explorer web browsers.
When developing JavaScript, performance is one of the vital things. Therefore, I thought I’d share the performance of loops with JavaScript, and give some advice.
When I read the news this morning, it blew my mind! Microsoft will use the Gecko layout engine for IE 8.
First out was Opera, and then WebKit (which Safari and some other web browsers are based on), to pass the Acid3 test.
Looking at the upcoming releases of different web browsers I started to wonder whether specifying fonts in relative units, such as ems etc, will be a common approach in the future.
As you all know, form elements aren’t that easy to style, especially not consistently. At a first glance, the button element seems like a sure winner, but once you delve into it…
A number of exciting things have been going on in the DOMAssistant camp, so I thought I’d fill you in with some of the latest. We’re talking plugins, developer tools and taking a glimpse into the future.
For those of you who have missed it, IE 8 beta is now available for download. Let’s take a quick look on what’s in it.
I am, hypothetically ( ) working on an e-commerce site, and the other day I discovered that IE doesn’t post all values with a form.
As reported all over Internet, Microsoft has completely turned around regarding their initial Standards Mode approach in the upcoming IE 8.
A topic that just can’t be discussed enough is Microsoft and how some of their decisions affect us Web Developers, end users and, consequently, the entire world.
For me and a lot of other people I’ve been talking to, the latest release of Firefox haven’t really been delivering.
Ever had the problems with width set in percentage, and every web browser seem to treat it differently? Elements falling down in IE, ruining your layout? I sure have, and John Resig explains how it really works.
There’s a fire spreading over the Internet right now, and it’s about the new Microsoft idea with version targeting in their new IE 8 web browser.
We all know that Internet Explorer hasn’t been the best of the bunch rendering CSS properly, and while IE 7 got better, it’s far from perfect. I have an example here where I can’t make links (appear) clickable, no matter what.
The year 2007 has come to an end, or rather, it very soon has. I thought I’d write a summary of what happened me as well as on the web during 2007, to have a closure for the year that has passed.
Opera brings Microsoft and Internet Explorer in front of the European Commission with an antitrust complaint.
Since the CSS support in Internet Explorer, especially in versions prior to Internet Explorer 7, has been lagging quite substantially, clever web developers have started using CSS expressions to mimic CSS functionality. However, few realize how this affects performance.
Writing such a post as this might seem like such an obvious way to get a lot of comments. And that’s just what it is!
Mobile surfing. Is that your poison? To be honest, I do no mobile surfing at all (anymore), but the general interest to do so seems to grow stronger every day. And from what I’ve heard, a lot of people have been impressed and satisfied with Opera Mini, so therefore I’d like to announce the Opera Mini 4 beta 2.
Just an hour or so ago, Roger and I were talking over e-mail about a completely different topic, when he gave me a tip that a beta of Safari is now available, and it also offers a Windows version!
Well, I guess the title and the image basically says it all…
I don’t know why, but problems seem to always be especially good at showing their ugly face at work in Friday afternoons/evenings. This time around, IE (big f**king surprise) displayed an odd behavior when using the addEvent method on the window object.
When using floats in CSS, without a doubt you have encountered the interesting effects it will have on the following content. Here I will show you different ways to clear floats without any extra mark-up.
Recently in a project I’ve been working on, I stumbled across something that I haven’t seen before: one AJAX call was possible to make in the web page, but after that it stopped working.
One of my top annoyances when surfing around is when some “clever” web developer has chosen to use a script that resizes the web browser window to what they think suits their web site. Stop doing that! The size of my web browser window is the one I like, and I very much like to keep it that way.
Do you hate when this happens to? Please sign the petition (or, rather, write a comment) below, to state:
No, we don’t accept you resizing our web browser window anymore! You resize, and we’ll leave your web site forever.
Don’t worry, this is not a post about Internet Explorer’s support (or lack thereof) of code support, but instead solely focused on the end user experience. I regularly try out a number of web browser, and I have one question:
Why would anyone use Internet Explorer?
I’m constantly baffled why most companies and web developers don’t understand, or care about, the importance of using good semantic URLs. Therefore, I though I’d outline some reasons to help you understand why you really should care.
When I got my first computer back in 1996, it was an IBM PC with Windows 95 on. Since then I got into web developing and I’m living a fairly computer-intense life (at least in the daytime), and I’ve realized more and more that I’m phasing out one Microsoft product after another from the software I’m using.
With the advent and following mass adoption of Internet Explorer 7, I’ve been pondering what web browsers to ensure support in, and which one to finally ditch. I’ll explain my choices below, but while reading the post, something like TheCounter’s Browser Stats for February 2007 can be a good reference point.
Firefox, The Little Memory Hog lived happily together with his family, the Mozillas, in a land far far away. Firefox had now turned 2.0.0.1 and it was time to attend kindergarten.
Recently I got a bug report from marketing (don’t all bug reports come from there? 
), about an unexpected problem in Firefox in Mac OS X. The end users had problems tabbing through the web page, and especially through forms. Since I, at the time, sat on a PC, I couldn’t test with my settings, although I knew I hadn’t seen the problem on my Mac at home.
Say that you’re using a web page and you find the text, the images or the layout in general too small. What do you do? Some web browser makers understand just how important this issue is and some don’t; some have set a good example and some still linger on under the impression that being able to resize text is sufficient.
Who are the good guys here? Microsoft and Opera.
Now that Microsoft has released Internet Explorer 7 and the whole web development world is trying to figure out what works in it, and, more importantly, what doesn’t (let’s just not go there right now, ok?), I thought I’d give you some solace to your doubts whether to install it or not on your main Windows machine (most likely you have doubts what will happen to IE 6, which you, unfortunately, still need to test in and cater to, for a long time to come).
When I wrote Looking for a good interface developer? Here’s what to ask to make sure you’ve got the right person, I wasn’t sure if I should reveal the answers to you or just let you do the research yourselves. However, I came to the conclusion that this web site is really about sharing knowledge, and also that some of you might have some good extra input on my answers.
So, here are some answers and links to more information about the questions:
For those out there who are interested in statistics, or want to know more about the other readers of this web site, I’ve put together a little overview of the visitors.
It contains information about countries people come from, what platform they’re on and what web browsers they are using.
Are you perhaps looking for a talented interface developer? You’ve heard that web standards and perhaps accessibility is good to have experience with, but you don’t know how to determine the applicants’ experience.
Don’t worry anymore, I’ve put together a check list of what to ask to make sure they’re suitable and in the loop with proper and modern web interface development.
It seems likely that at the end of 2006 Internet Explorer 7 will be released. First, let me say that the IE team has undoubtedly done some great work when it comes to fixing the numerous flaws in IE 6 as well as adding a heap of new CSS support (more detailed in Details on our CSS changes for IE7), although I think it’s a joke that display:table still isn’t supported.
But, my main question is: is catching up good enough?
If you’re obsessed with using the keyboard instead of the mouse as much as possible, and you have chosen to use the best web browser out there, Firefox, then Smart Keywords is the feature that will make your day and save you a lot of time!
For many web developers, CSS means numerous of ways to create flexible designs, control fonts in a powerful manner and a central location for controlling the entire look of your web site.
Unfortunately, CSS is far from perfect so I thought I’d list the most common disappointments I have, given the current state of CSS support, and I will also go a little into what your options are and what the future holds.
Convince a friend/lover/enemy to download Firefox before September 15th, and your name will be put in the Firefox 2.0 code. I found this a little while ago and naturally I want to help to spread Firefox, and also to get my name in there. So, do it you too; just go to Firefox day and make it happen!
This article is co-written with Anne van Kesteren, W3C Member and contributor to the WHATWG and Opera specifications, R&D and QA person.
When developing a web page, DOM methods are generally the way to go when dynamically altering elements’ attributes and performing other operations. But what about adding content to a web page in the most efficient manner, both code- and performance wise? We claim that innerHTML is unmatched by any DOM methods available and that it is in most, if not all, situations the best option.
People seem to have this feeling that innerHTML is evil. Instead of one line of innerHTML you would use about twenty lines with calls to the DOM. Every such line making one change. However, innerHTML is actually not that bad. The web browser pretty much parses it much like it parses the original page and builds some DOM nodes out of it which are then inserted at the requested location. Some mutation events are dispatched for the few who care and all is fine.
When it comes to having greater scalability in a web page, especially in AJAX scenarios, innerHTML offers unmatched flexibility. There has also been benchmark tests verifying that innerHTML is more efficient compared to using DOM methods.
The fact that it is not in a standard is simply because nobody got around to it. If you read the mailing list of the W3C Web API’s Working Group you can see that Opera, Mozilla and Apple want it to be standardized and we bet Microsoft would like the same thing. New entrants in the web browser market are probably interested as well given that it has to be supported anyway. That it’s not in a standard is probably its biggest problem, apart from the name which doesn’t really scale well. On the other hand, people complain a lot about document.write() as well which is part of DOM Level 2 HTML.
So, go on! Start, or continue, to use the best tool available for the job!
An alternative solution to this problem is my FlashReplace library.
Although news of this has been around for a while, many people seem to have missed it and/or didn’t think it was worth reading up on. On the contrary, the implications of this are huge and will most likely affect a lot of web sites. Due to the patent case with Eolas, Microsoft has been forced to update how ActiveX components behave in web pages.
This dreaded update, named Microsoft Security Advisory (912945), has been available for a couple of months, but on April 11 it will be forced out en masse through Windows Update so we have a few days till all hell breaks loose. If you want to test your web pages before that, you can download the patch and install it right now.
The gist of the patch is that no interaction with ActiveX elements will be initially allowed until the user has enabled the ActiveX by clicking it or tabbing to it and then pressing spacebar or enter. When hovering the ActiveX element the user is presented with a tool tip text that reads:
Click to activate and use this control
Examples:
Naturally, no one wants your Flash movies, videos and the likes to be presented to the end user like that. “Luckily”, there’s a fix for it, which I guess is because of some kind of glitch in the patent. If you create the ActiveX object, in most cases this means an object tag, through script, then you will bypass this security warning.
There’s an article on MSDN, Activating ActiveX Controls, which describes different techniques doing this. Noteworthy is that it won’t work with inline scripts in the web page, only external ones.
Tanny pointed out a serious problem when it comes to JavaScript solution; something I’d read about but hadn’t tested properly. If Disable Script Debugging is disabled in IE (the checkbox is unchecked), the script workaround won’t function either. However, I think the default setting in IE is that this is enabled, so it will hopefully not affect a majority of the end users. You find that option under:
Tools > Internet Options > Advanced, under Browsing.
I don’t know any deeper details of the patent case, but I think the whole idea of this sounds ridiculous. My general opinions/fears are:
param elements to an object using DOM methods. Instead, writing out the same HTML code by using the innerHTML property worked… 
application/xhtml+XML will probably never see the light of day, since a lot of web pages will now depend on code like document.write and innerHTML (Note: innerHTML does indeed work in Firefox when the XHTML code is served as application/xhtml+XML).If this sounds like too much to you and you want a library/tool to do all this for you when it comes to using Flash, you can take a look at FlashObject (although unfortunately it relies on innerHTML to render the content).
As life on the web goes, many web developers won’t be aware of this, which will result in that you, as an end user, will have to allow every ActiveX movie you see. The solution to this is to uninstall the patch (thanks to City Of Rain for the heads up.):
So, whatever you do, please read up on this. It will affect you, as a web developer, end user or when supporting your grandfather’s computer usage…
Today has been just one of those days. I had some work I needed to get done as well as posting something very interesting. What happens?
Internet Explorer dies on my computer…
It started out with Firefox opening up every URL I tried to open in IE. I restarted the computer and set IE as the default web browser instead. This resulted in that every web page was just white, no dialogs worked and I couldn’t view source. Since IE has got such a tight grip on Windows, you can’t just uninstall it and then reinstall it again, so that wasn’t an option to easy fix it.
After some long time spent to try different approaches to fix the problem, I gave up and reinstalled Service Pack 2. Problem is, when the computer restarted and before I got into Windows, the installation contained some kind of wizard in, yeah, you guessed it: HTML. A dialog came up asking me if I wanted to open the file or save it. I choose open, which resulted in IE opening just a blank white page. I closed that window and got an error message. I was stuck.
I turned off the computer by pressing the on/off button and started Windows in Safe Mode. Removed Firefox just to play it safe and restarted it again. No wizard this time, everything seemed fine and I got into Windows. Opened IE: blank white page. Ready to scream words no man should ever utter, I bit my lip and went online once again to find the solution.
What I then found was this: How do I repair Internet Explorer in Windows® XP? and IEFix. I went with IEFix but they seem to do the same thing. Basically, here’s the guide (run IEFix.exe to skip the first three steps):
After that, my IE was actually whole again. All in all, though, with all problems I had, waiting, trying to find good guides etc I wasted about three to four hours of my day. The lesson is to never tie a web browser so tight to the operating system…
My feelings right now?
I.Hate.Internet.Explorer.
Last week I had a little tête-à -tête with Dag König where we talked about the upcoming release of Internet Explorer 7 
the latest beta preview and the future in general.
So, if that sounds interesting, or if you just want to hear my Sean Connery-like voice (yeah, right…), go listen now. The interview is unfortunately in Swedish, but, who knows, maybe the rest of you can pick up some Swedish web developing buzzwords…
Enjoy!
Microsoft has now publicly released IE 7 Beta 2 Preview, which you can download in their IE page. It is only available for Windows XP SP 2 as of now. Naturally, your favorite blogger (yeah, you know it’s true, just admit it! ;-)) has taken it out for a short test drive.
Ctrl + scroll wheel or Ctrl + +/- now zooms a web page.select elementsselect elements so they don’t shine through. Finally!XMLHTTPRequest support without ActiveXXMLHTTPRequest now works even if ActiveX controls are disabled.<!--[if lt IE 7]>
<link rel="stylesheet" href="CSS/ie.css" type="text/css">
<![endif]-->
min-width/max-width or min-height/max-height supportwidth and height is behind many flawed layouts on the Internet, and to see that this still isn’t supported is outrageous!:hover, :focus, :after and :before have no support (except for, naturally, :hover on a elements). Microsoft claim that :hover should be supported on all CSSI found something that shocked me when I tested this web site: no content was shown but the background color. After some research and testing, I found the error. I use an element for clearing floats that looks like this:
div.clear{
clear: both;
height: 1px;
margin-top: -1px;
overflow: hidden;
}
The result of this that everything vanished! I thought that maybe it had something to do with the margin-top or overflow property, but no. It was height: 1px that threw it off so much. And the thing is, no matter what height I set the element to, it didn’t work. I had to completely remove it, and then things worked just fine. Terrible!
Since it’s possible to run IE 5 and IE 6 side by side, I was hoping that this was also applicable to IE 6 and IE 7. I also read Matt Brett’s Running IE 7 Beta 2 and IE 6 on Windows XP post, but unfortunately it didn’t work.
I also got a really interesting dialog when I was trying to get the IE 6 stand-alone version to work:
Have you tested IE 7? What are your experiences and impressions?
The IE team has made a very wise decision to natively support XMLHttpRequest in IE 7. XMLHTTPRequest is the foundation of any AJAX usage, and I for one applaud the move to make it available without the demand for using ActiveXObject.
Using object detection, one can easily make your code backwards compatible as well:
var oXMLHttp;
if(typeof XMLHttpRequest != "undefined"){
/* Code for:
IE 7
Firefox, Mozilla etc
Safari
Opera
*/
oXMLHttp = new XMLHttpRequest();
}
else if(typeof window.ActiveXObject != "undefined"){
/*
Code for:
IE 5
IE 6
*/
oXMLHttp = new ActiveXObject("Msxml2.XMLHTTP");
}
Congratulations, all web developers! In IE 7, the select element and its rendering is finally fixed, according to the For the SELECT few… post at the IEBlog! Support for z-index and title has been added, as well as for zoom (Yay! ;-)).
This post is mostly applicable for Swedish readers, but I believe most of you in other countries stumble across this fairly frequently too.
Here in Sweden we have a publication called Internetworld , whose target group is mostly private users and small businesses. Their articles mostly deal with business gain, short press releases what has happened in the field of technology with things like new services on the web, Firefox increasing its user base etc. Out of general interest I read it, amongst a lot of other publications, just to stay on top of what’s going on and what people are talking about.
When I had worked a while in the internet business, I soon realized that they aren’t always exactly spot on with their articles, especially when it comes to technology choices, coding tips and its likes. However, what they’ve written has mostly been harmless and can at least be of some help to amateurs starting to code.
However, I just browsed through the latest issue with an article entitled “Web standards part 1 - Adapt the web site for different web browsers”. Just reading the headline, I realized it probably wasn’t going to be good. After going through it I came to the conclusion that it isn’t as bad as I first thought, they do, at least partly, try to convey the message that there actually is something out there called web standards and it is there for the device “Code once, run everywhere” kind of equivalent for web code.
Unfortunately, though, they have some parts and quotes that I sincerely think will hurt new web developers’ attitude towards web developing and that’s the reason for me writing this. They briefly touch on the fact that there are different interpretations by web browser vendors how web standards should be implemented. While that is to some degree true, it’s seldom knowledge that beginners need to know, it’s usually only interesting on a pretty high level, as long as you start out the correct way when you build your web sites. And it’s rarely a problem when you write HTML/XHTML, it’s usually when you code CSS that this will be more evident (which will, as I understand, be touched on in an upcoming part in this series).
The conclusion of the article is to follow web standards if you have no idea about your target group; otherwise, offer them an enhanced and web browser-specific version that only works under certain circumstances. Another conclusions is that web standards is an “advanced technique” and question if it’s worth to require that out the users to have such modern web browsers to be able to use your web site; talk about not understanding web standards.
I don’t know where to begin with to describe how damage such an attitude will do. Sure, naturally most if not every web site out there will work better in a later version in, say, Internet Explorer or Firefox than in Netscape 4 but that doesn’t give you the right to shut out users with an older web browser. It’s all about progressive enhancement.
Another thing is that even if you do know a lot about your visitors and the statistics, that situation can almost change overnight. Build an Internet Explorer-version on proprietary code just to realize a month later that many of them have started using any other web browser out there. Also, does anyone really know how many web browsers there are out there? Hundreds and hundreds, let me tell you that. Different web browsers on different operating systems, PDAs, cell phones, digital TV boxes et cetera. The only way to make sure that your code will work is to follow web standards. No, web standards will not solve your every problem, but that’s the closest you can get and definitely your best bet if you’re serious in what you do.
Let me quote some pieces in the article:
There are a number of reasons where you gain from following web standards, but here are also occasions when you don’t, which we will explain in some of the following tips.
After that, I never find any tip where the difference is proved. Also, that’s just the mindset that’s so dangerous and there has to be a realization that while web standards maybe won’t save the day automatically, they will never hold you back either.
In modern HTML, that is often referred to as XHTML…
What kind of crap is that? There’s HTML and there’s XHTML; they are two different things and none of them are really more modern that the other. Something that really bothers me is that that isn’t even mentioned and doctypes are totally left out. No wonder you think there are differences out there if you don’t know how to choose a doctype and what effects that choice will have on the rest of the code.
Usually the unit px (pixels) is the one unit that gets interpreted most alike amongst the web browsers
While I kind of get what he’s going for, like percentage rounding errors in some web browsers and its likes, talk about killing the accessibility factor. You can’t make such a statement that will give such repercussions without explaining it in a more detailed way. And what about ems? Ever heard of those?
Conclusively, maybe I’m way too hard on this guy. After all, I do sincerely believe that he meant well with the article and tried to help people, but my fear is just that he did as much harming as helping; hence this post.
