如何以间隔刷新当前页面的 iframe？答案

【问题标题】：How do I refresh an iframe of the current page with an interval?如何以间隔刷新当前页面的 iframe？
【发布时间】：2016-08-07 23:33:33
【问题描述】：

我正在尝试使用此脚本将页面 iframe 放入自身，并每隔一段时间刷新 iframe：

document.write('<iframe id="frame" src="' + window.location.href + '"><script>setInterval(function ()/{document.getElementById("frame").contentWindow.location.reload();},10000);</script>');

它所做的只是将'); 附加到页面末尾。

我将它用作其他人页面上的脚本来自动刷新。如果我只是刷新，间隔就会被破坏。

【问题讨论】：

请问您为什么使用document.write()？
@RayWu 您可以在页面加载之间保持控制台的持久性。另请参阅下面的答案...

标签： javascript html iframe page-refresh

【解决方案1】：

因此，虽然我仍然不清楚您要解决什么问题并且您的问题也不清楚（回想起来），但我很好奇我们如何在不创建无限循环的情况下解决这个问题。

window.top !== window.self

不会工作，因为它们是一回事，所以我认为这将在原始页面上使用散列，从子页面中省略它以将其与自己的克隆区分开来。

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>test</title>
</head>
<body>

    <h1 id="h1"></h1>
    <script type="text/javascript">
        document.getElementById('h1').textContent =  window.location.search;
    </script>


<script type="text/javascript">

    if (window.location.hash === '#origin') {

        var ifr = document.createElement('iframe');
        var props = {
            src: window.document.location.href + '?r=0',
            width: 500,
            height: 300,
            style: "border:1px solid red;width:500px;height:300px;"
        }

        for (var key in props) {
            ifr.setAttribute(key, props[key]);
        }

        document.body.appendChild(ifr);

        setInterval(function(){
            var s = ifr.src.split('?r=')[0];
            ifr.setAttribute('src', s + '?r=' + parseInt( Math.random() * 1000000))
            console.log(ifr.src);
            // you can skip this, but it illustrates the refreshes
            document.getElementById('h1').textContent = ifr.src;
        }, 2000);
    }

</script>
</body>
</html>

你必须自己运行它，代码 sn-p 不喜欢它的重定向尝试，我不能不同意......，-注意：只在 Chrome 中运行它，但其他地方应该有很多不同

另外，为了清楚起见，如果您将其保存为test.html，那么您应该将其运行为path/to/your/file/test.html?r=378426#origin

【讨论】：

【解决方案2】：

对查询字符串的处理方式做了一些捷径，但要点在这里。

创建一个 iframe 对象，添加其属性，然后添加到 DOM，最后每隔一段时间使用新的查询字符串重新加载页面

    var ifr = document.createElement('iframe');
    var props = {
        src: 'http://example.com/?r=0',
        width: 500,
        height: 300,
        style: "border:1px solid red;width:500px;height:300px;"
    }

    for (var key in props) {
        ifr.setAttribute(key, props[key]);
    }

    document.body.appendChild(ifr);

    setInterval(function(){
        var s = ifr.src.split('?r=')[0];
        ifr.setAttribute('src', s + '?r=' + parseInt( Math.random() * 1000000))
        console.log(ifr.src);
    }, 10000);

【讨论】：

所以你想把页面框起来吗？请问为什么？
正如我所怀疑的（但我自己很快就运行它进行健全性检查），如果您在嵌入相同页面的页面上运行这样的脚本，然后继续刷新它，您最终会得到电梯镜面效果。 src: window.document.location.href + '?r=0' 应该适用于我之前的答案，但我无法理解你为什么要这样做......
我最初打算在 Slack Electron 应用程序的控制台中运行它以更快地更新消息。