js页面刷新之实现框架内外刷新（整体、局部）

这次总结的是框架刷新：

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

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

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

代码如下（两个html页面）：

 1 <!--主界面index.html--> 2   <iframe src='/images/loading.gif' data-original="页面刷新.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>

如有错误，请您更正！

原标题：js页面刷新之实现框架内外刷新（整体、局部）

关键词：JS