• JS_ifream通信


    准备工作;

    1,建三个HTML页面,命名ifream.html, ifream_temp1.html, ifream_temp2.html, 在ifream.html中把另外两个调用出来;

    如:

    /*
    * ifream.html中body结构
    */
    <
    div class="ifream"> <iframe src="ifream_temp1.html" width="500" height="50" frameborder="0" id="ifream_temp1"></iframe> </div> <div class="ifream"> <iframe src="ifream_temp2.html" width="500" height="50" frameborder="0" id="ifream_temp2"></iframe> </div>
    /*
    * ifream_temp1.html中body的机构
    */
    <
    input type="button" value="add" id="add" />
    /*
    * ifream_temp2.html中body的结构
    */
    <
    input type="text" id="ifream" />

     我们的目标是在temo1中点击add在teml2中显示我们所要显示的内容.

    /*
    * 在ifream_temp1.html中添加的javascript代码;
    * ifream.contentDocument 在IE6,7下返回的是indefined;
    * ifream.contentWindow 是个非标准但是全部兼容的属性,返回ifream的window对象; 所以还有个写法.
    */
    <
    script type="text/javascript"> function ifreamContent(ifream){
        if(!!ifream.contentDocument) return ifream.contentDocument;
        return ifream.Document;
    } add.onclick
    = function(){ var ifream2 = window.top.document.getElementById('ifream_temp2'); var add = document.getElementById("add"); var dom2 = ifreamContent(ifream2);  //   var dom2 = ifream2.contentWindow.document; dom2.getElementById("ifream").value = "hello" } </script>

    ps: dom加载的完时候只能获取ifream的这个节点,他里面的内容获取不到,所以有关ifream的操作需要注册到window.onload活着别的事件下才能正确获取ifream的document对象

  • 相关阅读:
    vue生命周期
    vue input 循环渲染问题
    Node express post 大小设置
    webpack 好文章
    知识点的总结
    jsplumb 使用总结
    理解es6 中 arrow function的this
    分块编码(Transfer-Encoding: chunked)
    CGI的工作原理
    JS数组循环的性能和效率分析(for、while、forEach、map、for of)
  • 原文地址:https://www.cnblogs.com/somesayss/p/2837916.html
Copyright © 2020-2023  润新知