动态设置Src时更改iframe样式

Question

在我的网站中，我有这个iframe

<iframe id='iFrameName1' width='1000' height='500'></iframe>

使用javascript动态定义src标记。另外，我想动态更改iframe的样式（它在同一个域中）。

<script> function urlChange() {      
var iframe1 = document.getElementById('iFrameName1'); 
iframe1.src = 'mypage.html';
var cssLink = document.createElement("link"); 
cssLink.href = "iframe.css";  
cssLink.rel = "stylesheet";  
cssLink.type = "text/css"; 
iframe1.contentDocument.getElementsByTagName('head')[0].appendChild(cssLink); 
}  
</script>

问题是：由于src是动态定义的，我认为＆＃34; iframe1.contentDocument＆＃34;找不到。

如何解决这个问题？我想定义src并动态更改iframe样式。

提前致谢。

Answer 1

修改

您可以像这样处理iframe的onload事件：

iframe1.onload = function(){ 
 ....
}

您的代码可能是这样的：

function urlChange() {      
    var iframe1 = document.getElementById('iFrameName1'); 
    iframe1.src = 'mypage.html';

    iframe1.onload = function(){
       var cssLink = document.createElement("link") 
       cssLink.href = "iframe.css"; 
       cssLink.rel = "stylesheet"; 
       cssLink.type = "text/css"; 
       var y = (iframe1.contentWindow || iframe1.contentDocument);
       if (y.document)y = y.document;
       y.getElementsByTagName('head')[0].appendChild(cssLink);  
    }
}

<强>样本：
http://swift-exploder-php-36-103575.apne1.nitrousbox.com/test/iframe/1.html

contentWindow的文件在这里： http://www.w3schools.com/jsref/prop_frame_contentwindow.asp

希望这有帮助。