IE6使用add方法添加optGroup的bug

简介:
合理的使用optGroup元素,可以极大地增强select下拉列表框的表现能力。我是比较喜欢在select中使用optGroup做数据分类的,不过不知道微软搞什么飞机,就这么一个html标签bug还真是不少。刚才又在使用DOM操作select添加optGroup时发现了问题。

    如下简单的代码,我们会得到什么结果呢?
< select  id ="slt1" >
</ select >
< script  language ="javascript" >
document.body.onload 
=   function ()
{
    
for  (  var  i = 0  ; i  <   3  ;  ++ i )
    
{
        
var  group  =  document.createElement('OPTGROUP');
        group.label 
=  'group  1 - +  i;  
        slt1.add(group);
    }

}
;   
</ script >

    按我们对select的add方法的理解,似乎应该得到分组列表框: ,但实际上我们得到的列表框却是: 。为什么会是第二种情况呢 ?那么我们来看看IE DOM操作后生成的Html到底是什么呢?
< SELECT  id =slt1 >
     < OPTGROUP  label ="group 1-0" >
         < OPTGROUP  label ="group 1-2" >
         </ OPTGROUP >
         < OPTGROUP  label ="group 1-1" >
         </ OPTGROUP >
</ SELECT >

    这是什么东东啊?optGroup怎么又嵌到optGroup里面去了?optGroup不支持mutli-hierarhical呀!

    原来我们必须改用通用的DOM操作方式,即使用appendChild(element)方法才能获得正确的select列表的分组结构,示例代码如下:
< select  id ="slt2" >
</ select >
< script  language ="javascript" >
document.body.onload 
=   function ()
{
   
for  (  var  i = 0  ; i  <   3  ;  ++ i )
   
{
       
var  group  =  document.createElement('OPTGROUP');
       group.label 
=  'group  2 - +  i;
       slt2.appendChild(group);
   }

}
;   
</ script >

    至于add方法的问题,只能算作optGroup的又一个bug了

本文转自博客园鸟食轩的博客,原文链接:http://www.cnblogs.com/birdshome/,如需转载请自行联系原博主。

目录
相关文章
在masm32中获取IE版本的方法2
在masm32中获取IE版本的方法2
在masm32中获取并显示IE版本的方法1
在masm32中获取并显示IE版本的方法1
|
Web App开发
clearTimeout 方法在IE上的兼容问题
clearTimeout 方法在IE上的兼容问题
70 0
|
JavaScript 前端开发
关于 getBoundingClientRect 方法在360极速浏览器的 IE 兼容模式下获取 documentElement 宽度比在 IE 浏览器下面多 4px 的问题
关于 getBoundingClientRect 方法在360极速浏览器的 IE 兼容模式下获取 documentElement 宽度比在 IE 浏览器下面多 4px 的问题
92 0
关于 getBoundingClientRect 方法在360极速浏览器的 IE 兼容模式下获取 documentElement 宽度比在 IE 浏览器下面多 4px 的问题
|
Windows
Windows 技术篇-安装指定版本Internet Explorer浏览器方法,IE浏览器的升级和降级
Windows 技术篇-安装指定版本Internet Explorer浏览器方法,IE浏览器的升级和降级
419 0
Windows 技术篇-安装指定版本Internet Explorer浏览器方法,IE浏览器的升级和降级
|
Windows
Windows 技术篇-Internet Explorer浏览器启用方法,windows找不到ie浏览器解决办法
Windows 技术篇-Internet Explorer浏览器启用方法,windows找不到ie浏览器解决办法
163 0
Windows 技术篇-Internet Explorer浏览器启用方法,windows找不到ie浏览器解决办法