js代码实现iframe内容定义样式的例子

发布时间:2020-02-06编辑:脚本学堂
本文介绍下,用javascript代码实现iframe中内容定义样式的方法,有需要的朋友,可以参考学习下。

例1,一个反馈表单应用在其它页面的iframe框架里,要求在框架外面可以定义框架里面的页面样式。

1、页面内容
 

<iframe name="feedbackform" id="feedbackform" src="xx.aspx" mce_src="xx.aspx" width="755" height="500" marginheight="0" marginwidth="0" frameborder="0" scrolling="no"></iframe>

2、js代码
 

复制代码 代码示例:
<script type="text/javascript">
var temp_css;
temp_css="<style type=/"text/css/">";
temp_css+="body{padding:10px 0;margin:0;font-size:12px;}";
temp_css+="</style>";
window.onload=function(){
var obj=window.frames["feedbackform"];
obj.document.body.innerHTML+=temp_css;
}
</script>

例2,在a.html中去改变b.html中.abc的颜色
1,a.html
 

复制代码 代码示例:
<iframe src="b.html" mce_src="b.html" id="content" name="content" height="15" width="468" scrolling="no" frameborder="0"></iframe>
<script type="text/javascript">
document.frames['content'].document.styleSheets[0].addRule(".abc","color:#FF0000");</script>

2,b.html
 

<style>.abc{color:#000000}</style>

用javascript操作iframe或其中的元素,还是比较方便的,希望本文介绍的方法,对大家有所帮助。
学html教程,就来脚本学堂 www.jb200.com