plasticwrapper

I was trouble-shooting a friend's DOM-Script the other day. It consisted of a form select element that was working in Firefox, but not in Explorer.

"Suprise, surprise," was my first thought. But, actually... Explorer had the correct behavior. For once.

The Markup

Pepperoni
Mushroom
Sausage

The Setup

Notice how these option tags do not have a (value="Pepperoni") argument. This way of writing the options creates a browser compatibility issue IE (6 and 7) and Mozilla browsers.

What Mozilla is doing (and shouldn't be)

If no "value" property exists for a given option object, Mozilla will automatically populate the "value" property with the "text element" child node.

In reference to the first code-snippet, the following javascript should return NULL, but in Mozilla it returns "Pepperoni".

alert(getElementById("favorite_topping_1").value);

The Next Question

If I were a browser developer, and I had to come up with the "correct" behavior for the following markup, what would it be?

myText

There are only two possibilities here:

1. The value is null
2. The value is 'myText'

I'm going to go with the first one.

Tags: browser compatibility, DOM, javascript, mozilla, option, XHTML

This entry was posted on Saturday, January 26th, 2008 at 10:36 pm and is filed under Browsers, DOM, XHTML. You can follow any responses to this entry through the RSS 2.0 feed. Responses are currently closed, but you can trackback from your own site.