yazzgoth.org

I’ve noticed something weird under Firefox and how it evaluates flow control statements…

Basically what I’ve noticed is that when I did

if(document.getElementById("someID") == null)
{
        // create new element with someID here
}

and I’ve put this in a timer event, so it was called every 60sec.

So what happened? Firefox evaluated it as

if(document.getElementById("someID")) 

Argh, completely the other way around I was expecting it !

Workaround?

if( (document.getElementById("someID") == null ) )
{
       // create new element with someID here
}

God bless FireBug

Well I know… JavaScript is a big quirk in general due to the browser incompatibilities.

When you build an event and attach it to a object in DOM by:

obj.onclick = handlerFunctionName;

and then you have a function declared like this:

function handlerFunctionName(ev)
{
    var element = ev.srcElement ? ev.srcElement: ev.target; // for compatibility between IE and FF
}

IE fails to execute that, where FireFox runs fine.
A quick fix for that is:

function handlerFunctionName(ev)
{
   ev = ev ? ev: event;
   var element = ev.srcElement ? ev.srcElement: ev.target; // for compatibility between IE and FF
}

Variable event is automagically created in IE but it doesn’t exist under FF, while under FF event is passed to the function and under IE it isn’t.

Another bump I’ve hit today was when I tried to selectively remove some images from a form based on their className.
A simple for loop which one may think will work will actually leave behind some of the images that it should remove.
Here is how not to do this:

for(i=0; i< images.length;i++)
{
   if(images[i].className=="deleteMe")
   {
      myForm.removeChild(images[i]);
   }
}

The reason for that is when you remove something from the images array you will skip one place ahead in the for loop iteration.
I’ve found some examples how to remove all child elements, but what I needed was to remove only some, so here is how I did it. It actually loops a bit more times than the previous example, as it’s iterating through all child elements in myForm

var myForm = document.getElementById("myForm");
var i = 0;
while( myForm.childNodes[i])
{
   if(myForm.childNodes[i].className == "deleteMe")
   {
      myForm.removeChild(myForm.childNodes[i]);
   }
   else
   {
      i++;
   }
}