ホームページ > ウェブフロントエンド > jsチュートリアル > jsページリフレッシュはフレーム内外のリフレッシュを実現(全体、部分)

jsページリフレッシュはフレーム内外のリフレッシュを実現(全体、部分)

高洛峰
リリース: 2016-10-12 11:18:15
オリジナル
1677 人が閲覧しました

这次总结的是框架刷新:

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

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

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

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

<!--主界面index.html-->
    <iframe src="页面刷新.html" frameborder="1"></iframe>
    <h1 id="iframeout">框架外内容</h1>
    <button onclick="fresh()">框架外刷新</button>
    
    <script>
        var h1 = document.getElementById(&#39;iframeout&#39;);
        function iframeout(){
            h1.style.color = "yellow";
            h1.innerText = "我变化了";
        }
        setInterval(iframeout, 800);
        function fresh(){
            // 框架主页面刷新,可以实现下面两个功能:
            top.location.reload();   //刷新整页 
            // window.parent.location.href=&#39;http://koushuling.top&#39;; //框架页重定向 
        }
    </script>
ログイン後にコピー
<!--框架页面:页面刷新.html-->
   <style>
        body{
            background-color: gray;
        }
    </style>
   
    <h1 id="test">框架内页面</h1>
    <button onclick="fresh()">框架内刷新</button>

    <script>
        var h1 = document.getElementById(&#39;test&#39;);
        function test(){
            h1.style.color = "red";
            h1.innerText = "我变化了";
        }
        setInterval(test, 1000);
        function fresh(){
            // 框架内页面刷新:可实现局部刷新与整个页面重定向
             self.location.reload();  //刷新框架内页面
            // window.parent.location.href=&#39;http://koushuling.top&#39;; //页面重定向 
        }
     </script>
ログイン後にコピー


ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート