你的位置:首页 > Java教程

[Java教程]页面刷新之实现框架内外刷新(整体、局部)


这次总结的是框架刷新:

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

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

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

代码如下(两个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>
 

如有错误,请您更正!