javascript - javascript cssで非表示に設定されたオーバーフローの可視コンテンツだけを取得する方法またはトリックはありますか?

Question

iframe の周りにdivを使用しており、divの css でオーバーフローを非表示に設定してい ます。コンテンツがクリップされます。

目に見えるコンテンツだけを取得する方法はありますか?

コードは次のとおりです。

  <div class="problemBox">
      <iframe id="problem" src="child.html"></iframe>
  </div>

<style>
  .problemBox {
    width: 300px;
    height: 300px;
    overflow: hidden;
  }
  .problemBox iframe {
    width: 100%;
    height: 100%;
  }
</style>