首頁 > web前端 > js教程 > 如何使用純 JavaScript 存取 Iframe 的 InnerHTML?

如何使用純 JavaScript 存取 Iframe 的 InnerHTML?

Patricia Arquette
發布: 2024-12-09 02:21:10
原創
367 人瀏覽過

How Can I Access the InnerHTML of an Iframe Using Pure JavaScript?

在 JavaScript 中存取 iframe 的內部內容

在 HTML 中,iframe 元素在其自己的文件中嵌入另一個網頁。要與嵌入頁面的內容進行交互,父文檔需要存取其正文的內容。

考慮以下iframe:

<iframe>
登入後複製

目標是擷取文字「test< br/>」

純JavaScript 解決方案

要以純JavaScript 存取iframe的正文內容,請使用以下技術:

1 。取得iframe元素:

var iframe = document.getElementById('id_description_iframe');
登入後複製

2.取得 iframe 的文件物件:

var iframeDocument = iframe.contentDocument || iframe.contentWindow.document;
登入後複製

3.選擇 bodyiframe 中的 bodyif元素:

var iframeContent = iframeDocument.getElementById('frameBody');
登入後複製

4.訪問body元素的innerHTML獲取內容:

var iframeBodyContent = iframeContent.innerHTML; // "test<br/>"
登入後複製

補充說明:

  • 此方案需要同源策略需要觀察。
  • 如果 iframe 來自不同的框架,請考慮使用跨域訊息傳遞或 CORS域。
  • 此技術不僅允許您檢索正文的內容,還可以選擇和操作 iframe 內的元素。

以上是如何使用純 JavaScript 存取 Iframe 的 InnerHTML?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板