zoukankan      html  css  js  c++  java
  • 控制iframe

    我终于会使用iframe了!两个文件example.htmltest.html,控制iframe里的内容:

    从父框架控制iframe

    //example.html

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    <html xmlns="http://www.w3.org/1999/xhtml">

    <head>

        <title>标题栏</title>

    </head>

    <body>

        <h1>

            在此窗体中嵌入test.html</h1>

        <iframe src="test.html" id="test" width="250" height="200" scrolling="no" frameborder="1">

        </iframe>

        <input type="button" id="btn1" name="btn1" value="ChangeInnerText..." onclick="javascript:frames('test').window.myH1.innerText='ffff'">

    </body>

    </html>

     

    嵌入的网页:

    //test.html

    <html>

    <body>

        <h1 id="myH1">

            hello,my boy</h1>

    </body>

    </html>

     

    点击按钮后:

     

     

    还可以在主框架中取嵌入的页面中数据:

    <input type="button" id="btn1" name="btn1"

    value="FatchIframeText..." onclick="alert(frames('test').window.myH1.innerText)">

     

     

    iframe控制父框架

    //example.html

    <html>

    <body onclick="alert(tt.myH1.innerHTML)">

        <iframe name="tt" src="test.html" width="250" height="200" scrolling="no" frameborder="1">

        </iframe>

        <h1 id="myH2">

            hello,my wife</h1>

        <input type="button" id="btn1" name="btn1" value="button1" onclick="alert(tt.myH1.innerHTML)">

    </body>

    </html>

     

     

    //test.html

    <html>

    <body>

        <h1 id="myH1">

            hello,my boy</h1>

        <input type="button" id="btn2" name="btn2" value="ChangeParentText" onclick="parent.myH2.innerText='hello,my friend'">

        <input type="button" id="btn3" name="btn3" value="ChangeParentHTML" onclick="parent.myH2.innerHTML='hello,my friend'">

    </body>

    </html>

     

    主框架上的文字改变了。

  • 相关阅读:
    Batch Normalization
    常用shell命令
    把chord下dbm_noauth做成静态库,提供接口
    vim中多标签和多窗口的使用
    recv返回值
    在XP下从硬盘安装windows 7的方法
    Linux文件系统中的链接
    统计出现次数排名
    linux编程环境
    windows命令行修改连接的DNS
  • 原文地址:https://www.cnblogs.com/yansc/p/632180.html
Copyright © 2011-2022 走看看