如何使 Iframe 自動調整大小以適應其內容？

自動調整iframe 尺寸以適應內容

問題：

如何自動調整iframe 的寬度和高度精確地適應其所包含的內容？這種調整應該在 iframe 載入後就可以進行。

解決方案：

要實現此目的，需要一個事件操作來處理體內尺寸的變化iframe。解決方法如下：

function resizeIFrameToFitContent(iFrame) {
  iFrame.width = iFrame.contentWindow.document.body.scrollWidth;
  iFrame.height = iFrame.contentWindow.document.body.scrollHeight;
}

window.addEventListener("DOMContentLoaded", function (e) {
  var iFrame = document.getElementById("iFrame1");
  resizeIFrameToFitContent(iFrame);

  // To resize all iframes:
  var iframes = document.querySelectorAll("iframe");
  for (var i = 0; i < iframes.length; i++) {
    resizeIFrameToFitContent(iframes[i]);
  }
});

上面的程式碼中：

• resizeIFrameToFitContent()函數根據iframe的滾動寬度和高度來設定iframe的寬度和高度屬性
• DOMContentLoaded 事件監聽器用於在iframe 載入後調整iframe的尺寸已加載。
• 可選的附加程式碼（已註解掉）可用於調整頁面上所有 iframe 的大小。

以上是如何使 Iframe 自動調整大小以適應其內容？的詳細內容。更多資訊請關注PHP中文網其他相關文章！