IE创建iframe设置frameborder为0

  在IE7-浏览器或者为添加xhtml申明的IE8浏览器(IE9+未测试),动态创建的iframe,当通过setAttribute设置iframe的frameborder时,IE下调用setAttribute设置属性时,frameborder是严格区分大小写,属性名称要写为frameBorder,不能为frameborder,否则无法去掉iframe的frameborder,会默认为1。

 

  标准浏览器或者添加了xhtml申明的IE8+浏览器没有这个问题。

 

  测试代码如下,动态创建的iframe和直接在dom里面放置的iframe,第一个边框没有被去掉

IE创建iframe设置frameborder为0

<div id="dv"></div>
<script>
    window.onload = function () {
        var ifr = document.createElement('iframe'), dv = document.getElementById('dv');
        ifr.setAttribute('frameborder', 0);
        ifr.src = 'a.html';
        ifr.setAttribute('scrolling', 'no');
        ifr.style.height = '60px'
        dv.appendChild(ifr);
        alert(dv.innerHTML)
    }
</script>
<iframe frameborder="0" src="a.html"></iframe>

  解决办法:

1)frameborder属性名称修改为frameBorder。

2)object.setAttribute(sName, vValue [, iFlags]),利用setAttribute的第三个缺省参数。

sName 必填项. String类型,属性名,

  sName参数应是Dom属性而非html中的属性, 这里我一直存在误解,以为sName和html中属性名相同,以后要切记!切记! 原来一直设置单个单词属性,也没出现什么问题。现在frameborder是个双字节属性,问题就出来了。Dom中Html专有的接口属性应该以小写字母 开头,如果属性有多个单词构成,第二个单词以及接下来的每个单词的首字母都要大写。

  因此以后如果设置input,maxlength属性就 应写成“setAttribute(‘maxLength’,’50′)”而非maxlength。另外比较特殊的是设置class属性,dom中我们用 HTMLElement的className属性,在这里按上面说的应写成setAttribut(‘className’,'c’)在IE下正确,但 FF下并不行,FF认识class。


兼容性写法

element.setAttribute("class", value); //for firefox
element.setAttribute("className", value); //for IE
vValue 必填项. 为属性指定的变量,可以为string, number, 或者 Boolean类型
iFlags 选填. 下面指定的两种 Integer 类型的标志
0 覆盖同名属性.
1 默认值. 为属性添加指定的值.

 

加支付宝好友偷能量挖...


原创文章,转载请注明出处:IE创建iframe设置frameborder为0

评论(0)Web开发网
阅读(228)喜欢(0)JavaScript/Ajax开发技巧