改变iframe里页面的内容

网页里有这么一个iframe, 假设src值为百度主页:
<iframe  name="f1" id="fid"  src="http://baidu.com"></iframe>
我需要通过js来把iframe框架里的第一个图片的src属性(也就是百度的logo),换成http://xxx.com/xxx.jpg搞了好久都没成功,据说跨域改iframe内容是不行的....是这样么?希望高手指点一下,麻烦各位测试成功以后再回答,复制粘贴的答案就不用了.....先行谢过!!!!!!

解决方案 »

  1.   

    可以后台动态生成html，把iframe的页面刷新一下指向新生成的html。
      

  2.   

    跨域改iframe内容，有安全性限制
      

  3.   

    <iframe name="f1" id="fid" src="http://baidu.com"></iframe>
      <script>
      function aa(){
    document.getElementById("fid").src="http://avatar.profile.csdn.net/1/4/D/2_allhack.jpg";
    }
      </script>
      <INPUT TYPE="button" value="ss" onclick="aa();">是这个吗？
      

  4.   


    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <HTML>
     <HEAD>
      <TITLE> New Document </TITLE>
      <SCRIPT LANGUAGE="JavaScript" src="jquery-1[1].3.1.js"></SCRIPT>
     </HEAD>
    <SCRIPT LANGUAGE="JavaScript">
    <!--
        function getContent() {        $.get('http://www.baidu.com', function (data) {
                alert("Data Loaded: " + data);            $("#d1").html(data);            var googleImg = "http://www.google.com.hk/logos/2010/oz10-hp.gif";            $($("#lg").find("img")).attr("src", googleImg);
            }); 
        }
       
    //-->
    </SCRIPT>
     <BODY>
       <input type="button" value="获取百度页面的内容，Logo改为Google的图片" onclick="getContent()"/>
          这里是加载的内容<br/>
          <div id="d1" style="width:600px;height:500px; overflow:auto;"></div>
     </BODY>
    </HTML>
      

  5.   

    重写了一个，改变IFRAME的内容，把百度的logo改成google的<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <HTML>
     <HEAD>
      <TITLE> New Document </TITLE>
      <SCRIPT LANGUAGE="JavaScript" src="jquery-1[1].3.1.js"></SCRIPT>
     </HEAD>
    <SCRIPT LANGUAGE="JavaScript">
    <!--
        function getContent() {        //alert($("#fid").attr("src"));
            $("#fid").attr("src", "");
            //alert($("#fid").attr("src"));
            $.get('http://www.baidu.com', function (data) {
                //alert("Data Loaded: " + data);
                $("#d1").html(data);
                var googleImg = "http://www.google.com.hk/logos/2010/oz10-hp.gif";
                $($("#lg").find("img")).attr("src", googleImg);            var cw = window.frames['fid'];
               
                cw.document.open();
                cw.document.write($("#d1").html());
                cw.document.close();        });   
        }
        $(document).ready(function () {
            $("#fid").attr("src", "http://www.baidu.com")
        }); 
       //-->
    </SCRIPT>
     <BODY >
       <input type="button" value="改变百度的Logo为Google的" onclick="getContent()"/>
          <iframe name="f1" id="fid" style="width:800px;height:600px;overflow:auto;"></iframe>
          <div id="d1" style="width:800px;height:600px;overflow:auto;display:none"></div>
     </BODY>
    </HTML>
      

  6.   

    跨域了，就你那样直接加载百度的页面无解你可以自己代理页面捉取百度页面然后输出所有html代码，iframe加载和这个代理页面，这样就可以修改了，不跨域
      

  7.   

    我试了一下,根本没有显示百度的页面......请问你在什么版本浏览器下成功的?  我在ie8 ff chrome上测试均无显示,iframe里是空白的....
      

  8.   

    IE7 下通过。其他的没测~
    需要用到jquery文件，不知道你引用了没