IE创建iframe设置frameborder为0(转)

时间：2014-06-17

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

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

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

<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 默认值. 为属性添加指定的值.