javascript - 有没有办法找出 iframe 的内容是否发生了变化？

Question

如果我的 iframe 的内容发生了变化，我正在寻找一种在 js 中每隔 x 秒检查一次的方法，如果是，请刷新它以查看更改。我想这样做是因为只需每 x 秒刷新一次就可以让它非常明显，并强制 iframe 每次都返回到滚动条的顶部。iframe 的 src 在同一个域上，所以我对同源策略没有任何问题。

谢谢 ！

Answer 1

这很简单。以指定的时间间隔进行 Ajax 调用以检索页面的内容。将新的内容长度与之前的内容长度进行比较，并重置是否有任何差异的src属性。iframe

const URL = 'https://stackoverflow.com';
let content = '';
setTimeout(() => {
  $.ajax({
    url: URL,
    type: 'GET',
    success: (res) => {
      if (content.length !== res.length) {
        content = res;
        $('#myframe').attr('src', URL);
      }
    },
    error: (jqXHR, textStatus, errorThrown) => {
      console.error(textStatus);
    }
  });
}, 5000); // Check difference and refresh iframe in 5 seconds interval

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<iframe id="myframe" src="https://stackoverflow.com"></iframe>