关于select对象在FireFox中的一个兼容性问题

现象：
var objOpt = document.createElement("option");
objOpt.value = “value“;
objOpt.text = “text“;
objSelect.add(objOpt);
最后一行出错

修改后在IE6和FireFox中通过
var objOpt = document.createElement("option");
objOpt.value = “value“;
objOpt.text = “text“;
try{
    objSelect.add(objOpt);
}catch(e){
    objSelect.add(objOpt, null);
}


http://www.talkaboutprogramming.com/group/comp.lang.javascript/messages/422841.html

On Mon, 15 Mar 2004 20:27:29 +0100, eremax <eremax@[EMAIL PROTECTED]
> wrote:

[snip]

> if (document.topics.areas.length == 1)
>   document.topics.areas.add(new Option("intranet","",false,false));

[snip]

> Well, any idea about the reason why ? A matter of syntax ? Another issue
> ?

The method, HTMLSelectElement.add(), is a Document Object Model (DOM)
method. It expects two arguments. The first is a reference to the new
HTMLOptionElement to insert, while the second is where to insert it.

There is a very serious problem I encountered when I was checking the code

I was going to propose and, as usual, Microsoft are the cause.

According to the DOM 1 HTML Specification, the second argument should
either be a reference to the element that the new OPTION is inserted
before, or null for the end of the list. According to Microsoft, it is the

index of the element that the new OPTION will be inserted before. As you
can see, the two are completely incompatible (one is an object, the other
is a number).

The only way around it is to catch the exception that will be thrown when
the method is called with the wrong type of argument. If the browser
supports the DOM, it is quite likely that it will support try...catch,
too.

The result of all this is:

   var areas = document.topics.areas;

   if( 1 == areas.length ) {
     var option = null;

     // If the browser supports DOM, use it
     if( document.createElement && areas.add ) {
       // Create the new OPTION element
       option = document.createElement( 'option' );

       if( option ) {
         // Once the option has been created, set the display text for it
         option.text = 'intranet';

         // Attempt to use Microsoft's incorrect method to add the
         // element to the end of the list
         try {
           areas.add( option, 1 );
         } catch( e ) { // If it fails, use the correct DOM approach
           areas.add( option, null );
         }
       // If DOM is not supported, check if the Option constructor is
       // available
       } else if( Option && areas.options ) {
       option = Option( 'intranet' );

       // Add the new option to the end of the list
       if( option ) areas.options[ 1 ] = option;
     }
   }

In your reply to Mr White, I noticed that you were concerned about the
missing value, selected and defaultSelected arguments to the Option
constructor. The arguments are optional. If missing, they should default
to an empty string, false, and false, respectively. The same is true for
the DOM approach. Note that properties are set separately with assignments

when using the DOM, not in a method call.

Hope that helps,
Mike