日期:2014-05-16  浏览次数:20307 次

iframe框架用JavaScript子页面控制父页面
<iframe marginwidth="0" framespacing="0" marginheight="0" frameborder="0"
name="uploadframe" id="uploadframe" src="c.html" scrolling="no" width="100" height="100" ></iframe>
如想在c.html 中写一些代码去改变parent.html 中的一些内容,以下代码可作为参考:

1、parent.window.frames 可返回parent.html 中所有的iframe;返回结果应该是一个数组,用parent.window.frames[iframeId]可得到iframeId;

2、用parent.document.getElementById('xxxx')可得到父里的xxxx,并改变相应的值,例如:parent.document.getElementById('xxxx').className = 'test';

3、如果我想在父中再创建一个元素,直接用parent.appendChild(yyyy)在firefox中是可以的,但在IE(最起码IE6)是不行的; 所以,要把创建这个动作放在父中来完成,在子中调用;

例如:父中的代码为:


function addIframe(vNum){
var iframe = document.createElement("iframe");
iframe.setAttribute("marginwidth", "0");
iframe.setAttribute("framespacing", "0");
iframe.setAttribute("marginheight", "0");
iframe.setAttribute("frameborder", "0");
iframe.setAttribute("name", vNum);
iframe.setAttribute("id", vNum);
iframe.setAttribute("src", "http://www.zishu.cn");
iframe.setAttribute("scrolling", "no");
iframe.setAttribute("width", "100");
iframe.setAttribute("height", "100");
document.getElementsByTagName('body')[0].appendChild(iframe);
return;
}
子中可以这样调用:


<script>
parent.addIframe('xxxx');
</script>
这样就能完整创建一个元素了;

4、同理,如果我想在子中把iframe给隐藏,本来想直接用parent.document.getElementById('uploadframe').style.display = 'none';来弄,但无论是在IE还是FIREFOX中,都是行不通的;只能用上边的方法把动作放在父中。