zoukankan      html  css  js  c++  java
  • iframe

    直接从word里面贴过来的  随便看看吧

    (注意:在测兼容性时,chrome可能显示不了,实际是因为安全问题,chrome只能在服务器环境下执行。)

    1. 1.  父级操作子级对象 (两种获取子级iframe对象)

    var oIframe = document.getElementById('iframe1');

    1、oIframe.contentWindow.document.getElementById('div1').style.color = 'red';
    //所有的浏览器都支持

    2、oIframe.contentDocument.getElementById('div1').style.color = 'yellow';
    //ie 6 7不支持

    1. 2.  子级操作父级对象

    window.parent.document.getElementById('pare').style.color = 'red';

    //所有浏览器都支持  操作的是父级

    window.top.document.getElementById('pare').style.color = 'yellow';

    //操作的是最顶级

    1. 3.       iframe动态加载完会有onload事件

    window.onload = function(){
        var oIframe = document.createElement('iframe');
        oIframe.src = 'ddd.html';
        document.body.appendChild(oIframe);

    方法1:
        oIframe.onload = function(){
            alert(1);
        } ;

    方法2:
        //ie下的iframe的onload事件只能用绑定的形式
        oIframe.attachEvent('onload',function(){
            alert(1);
        });
    }

    1、 如何对iframe子级实现防钓鱼功能

    主要原理是验证当前window对象是否是顶级window.top对象,如果不是就强制跳转到自己的主页。

    if(window!=window.top){

    window.top.location.href=window.location.href;}

    2、 如何改变iframe的大小。使其自适应子级

    window.onload = function(){
     var aInput = document.getElementsByTagName('input');
     var oIframe = document.getElementById('iframe1') ;
     function changeHeight(){
             //定时器的作用是延迟 以免该函数执行太早出问题
    setTimeout(function(){oIframe.height=oIframe.contentWindow.document.body.offsetHeight;},100) }
        changeHeight();
        aInput[0].onclick = function(){
            oIframe.src = 'ddd.html';
            changeHeight();
        };
        aInput[1].onclick = function(){
            oIframe.src = 'eee.html';
            changeHeight();
        }
    }

  • 相关阅读:
    安装go语言开发环境
    【Graph】399. Evaluate Division(Medium)
    【Divide and Conquer】53.Maximum Subarray(easy)
    int数组交并差集
    Git强制覆盖本地文件
    Git手动合并
    [转]关于BETA、RC、ALPHA、Release、GA等版本号的意义
    [置顶] java处理office文档与pdf文件(二)
    [置顶] 左联接数据不统一问题
    将博客搬至CSDN
  • 原文地址:https://www.cnblogs.com/mian-bread/p/5194810.html
Copyright © 2011-2022 走看看