FireFox doesn't understand a DOM node-tree?

Have a look at this HTML snippet. When clicking the 'clickme' innerText of div2, I expect the browser to alert "div2", because div2 is the first child of its parent, div1.

<div id="div1">
  <div id="div2" onclick="alert(this.parentNode.childNodes[0].id)">clickme</div>
</div>

I've tested this HTML snippet on both IE and FireFox, and guess what?
IE reacts as expected by alerting "div2".
However, FireFox alerts "undefined"....?

Apparently, in FireFox div2 is considered to be the second childNode of div1; not the first. I guess this is because FireFox parses the whitespace between div1 and div2 as being a seperate node! BUT WHY????

Did the creators of FireFox (Mozilla Foundation) implemented this by design? Is it ever going to be fixed in FireFox? Or do we just have to live with it, and write seperate javascript for IE and FireFox?

[Note: of course I can let IE and FF return the same results by removing all whitespace between the div1 and div2 tags, but that would result in human-unreadable and hard to maintain Html.]

Postscript:
I've received a lot of comments about the fact that FireFox precisely (I'd say 'rigidly') follows the w3c DOM recommendation on this. I'm aware of the w3c specs, but I still think it sucks having to write seperate code for IE and FF (or include a library of wrapper functions).
Personally, I think the IE dom-representation is the more sensible one, whether it's in the recommendation or not.
And FireFox just made a very bad 'first impression' to me :(

Read these links on more information why Mozilla has chosen to preserve whitespaces in the DOM:

6 Comments

  • Firefox is following the standard, while IE isn't.

  • If you knew anything about the way this works, you'd know that Firefox is right; the whitespace is a valid node. Just because IE works the way you want doesn't make it corrent.

  • I cannot think of the amount of whitespace I have removed from otherwise human-readable HTML documents because of IE's whitespace rendering bugs. And you want to complain about having to remove a little for firefox.

  • There is nothing wrong with the way firefox handles the DOM. Why don't you post what you are trying to do - someone will be able to help you.



    -Ron Krauter

  • This is a nice example of the difference between Html and Xml. In Html you're almost never interested in the whitespace used to format the Html. It's not functional for the page the Html describes. In the strict world of Xml this is not possible. Everything is a node. So how would you solve this in XHtml where the world of Html and Xml merge...?



    I do think you could try to write code that is more robust though... ;-)

  • Seems to be a lot of FF junkies here. FF is handling the DOM tree correct by protocol, but incorrect by any reasonable or sensible measure.

    It is silly to encourage whitespace to be promoted to having end-structure altering abilities. Why should code stripped of whitespaces return a different result than that same code full of whitspaces? What's next? Comments affecting code?

    IE recognized this flaw and corrected it, making it the superior handler in this case, regardless of silly standards. Unfortunately, some people are sucked in to the belief that protocol is correct, no matter what. Protocol consistency is great. However, when protocol is flawed, it needs to be fixed; not swept under the rug as, "it's procotol, so it's right."

Comments have been disabled for this content.