解决iframe实时获取资源页面显示空白的问题

// 判断该页面在浏览器是否可见，获取可见状态
// document.visibilityState： 只读属性，它的值是 visible，hidden，prerender 或者 unloaded 之一。
// 如果网页可见会返回 visible，隐藏则返回 hidden。
let page_state = document.visibilityState;
let timer_yxh = null;
let o_yxh = document.getElementById('tableList');
if (page_state == 'visible') {
  // 当页面可见的时候开启定时器，监控iframe资源是否加载出来，
  // 在这里通过元素的宽高来判断，内容是否加载出来
  timer_yxh = setInterval(() => {
    // 只能通过行内样式才能获取到。获取到的元素宽高不包括padding和border
    // console.log('div 宽高', o_yxh.style.width, o_yxh.style.height) 
    // 元素的宽度包含padding不包含border
    console.log('client 宽高', o_yxh.clientWidth, o_yxh.clientHeight)
    // console.log('scroll 宽高', o_yxh.scrollWidth, o_yxh.scrollHeight)
    // 元素的宽度包含padding和border
    // console.log('offset 宽高', o_yxh.offsetWidth, o_yxh.offsetHeight)
    console.log('=====================================================')
    // 在定时器内部实时获取元素的宽度，在外部获取可能会造成数据不准确
    var client_W = o_yxh.clientWidth;
    // 如果元素宽度为0，则说明该iframe的内容没有显示出来
    if (client_W === 0) {
      // console.log("调用了方法，重新渲染页面dom结构和inner HTML内容")
      // 渲染数据的方法
      testFunction();
    }
  }, 3000)
} else {
  // 如果页面不可见将清除定时器
  clearInterval(timer_yxh)
}