• js页面刷新之实现框架内外刷新(整体、局部)


    这次总结的是框架刷新:

    框架内外的按钮均可以定义网页重定向,

    框架内部页面的按钮可以实现局部刷新,

    框架外部页面的按钮可以实现整页刷新。

    代码如下(两个html页面):

     1 <!--主界面index.html-->
     2     <iframe src="页面刷新.html" frameborder="1"></iframe>
     3     <h1 id="iframeout">框架外内容</h1>
     4     <button onclick="fresh()">框架外刷新</button>
     5     
     6     <script>
     7         var h1 = document.getElementById('iframeout');
     8         function iframeout(){
     9             h1.style.color = "yellow";
    10             h1.innerText = "我变化了";
    11         }
    12         setInterval(iframeout, 800);
    13         function fresh(){
    14             // 框架主页面刷新,可以实现下面两个功能:
    15             top.location.reload();   //刷新整页 
    16             // window.parent.location.href='http://koushuling.top'; //框架页重定向 
    17         }
    18     </script>
     1 <!--框架页面:页面刷新.html-->
     2    <style>
     3         body{
     4             background-color: gray;
     5         }
     6     </style>
     7    
     8     <h1 id="test">框架内页面</h1>
     9     <button onclick="fresh()">框架内刷新</button>
    10 
    11     <script>
    12         var h1 = document.getElementById('test');
    13         function test(){
    14             h1.style.color = "red";
    15             h1.innerText = "我变化了";
    16         }
    17         setInterval(test, 1000);
    18         function fresh(){
    19             // 框架内页面刷新:可实现局部刷新与整个页面重定向
    20              self.location.reload();  //刷新框架内页面
    21             // window.parent.location.href='http://koushuling.top'; //页面重定向 
    22         }
    23 </script>
     

    如有错误,请您更正!

  • 相关阅读:
    flask_日期和时间
    使用SQLAlchemy对博客文章进行分页
    P2725 邮票 Stamps
    P2679 子串
    P3396 哈希冲突
    P1754 球迷购票问题
    P1504 积木城堡
    P1244 青蛙过河
    CSP-S 2019 考试分析
    2019.11.11 模拟赛 T2 乘积求和
  • 原文地址:https://www.cnblogs.com/ksl666/p/5951932.html
Copyright © 2020-2023  润新知