动态创建iframe—IE与其他浏览器的不同

 

 很多情况下,我们都要动态创建元素,比如动态创建iframe,iframe很特殊,它即可以看作是页面元素,也可以看作是窗体对象。所以,所对应的取法也不同。比如当作是页面元素的时候,这样取:document.getElementById('iframe_id'),当作是窗体对象的时候取法就多了,主要有三种:1、window.frames[index]    2、window.frames['iframe_id']    3、window.frames.iframe_id  

这三种取法在IE里都一样,都能正确得到iframe对象,Opera也能正常取出,但惟独FireFox却不好使,不管你用哪种取法总是取不出!开始自己也一直想不通错在了那里,想可能是FireFox浏览器本身的一个Bug,但通过这次项目终于真相大白!

    项目要实现这样一个功能,动态创建一个form表单来跨域提交数据,并将form表单的target设置成动态创建的iframe(页面不会跳转到提交的页面)。即:MyForm.target="iframe_name"。那么在创建iframe的时候就要给它赋name属性。问题就出现了,代码如下

<script language="javascript" defer="defer">
      var IframeObj = document.createElement("iframe");
       IframeObj.id= "myfrm";
       IframeObj.width =0;
      IframeObj.height =0;
       IframeObj.frameborder = 0;
      IframeObj.src="about:blank";
       IframeObj.name = "myfrm";
       document.body.appendChild(IframeObj);
</script>

这段代码在FireFox和Opera下都很正常,但在IE下却赋不了name属性!!!

于是我想可能是因为这样写是把它当作了一个页面元素,所以赋不了,那么就它作为一个window对象,然后再赋name属性。代码如下:

<script language="javascript" defer="defer">
      var IframeObj = document.createElement("iframe");
       IframeObj.id= "myfrm";
       IframeObj.width =0;
      IframeObj.height =0;
       IframeObj.frameborder = 0;
      IframeObj.src="about:blank";      
       document.body.appendChild(IframeObj);

       window.frames.myfrm.name = "myfrm";
</script>

     这样写IE是正常了,可FireFox确又不干了!!!错误提示是window.frames.myfrm没有这个属性???无奈之下只好这么写:

<script language="javascript" defer="defer">
      var IframeObj = document.createElement("iframe");
       IframeObj.id= "myfrm";
       IframeObj.width =0;
      IframeObj.height =0;
       IframeObj.frameborder = 0;
      IframeObj.src="about:blank";

       frameObj.name = "myfrm";
       document.body.appendChild(IframeObj);

       window.frames.myfrm.name = "myfrm";
</script>

这样写就一切正常了,于是我得出了这个结论:在FireFox下,取窗体对象是window.frames.frame_name,而不是windwo.frames.frame_id,在没写frameObj.name = "myfrm";这句代码的时候报没有window.frames.myfrm没有这个属性错误就是这个原因。既然window.frames.frame_name可以,那么window.frames[frame_name]和window.frames[index]当然也是可以的!

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值