当前位置: 首页>Php>正文

跨域獲取iframe的html,在iframe中寫html,使用jQuery在iframe中獲取HTML

跨域獲取iframe的html,在iframe中寫html,使用jQuery在iframe中獲取HTML

使用jQuery在iframe中獲取HTML

這是我的情況。

我有一個名為iframe.html的文件,其中包含圖像幻燈片的代碼。該代碼有點像

用戶可以使用嵌入代碼將幻燈片添加到他們的博客或網站(可以來自不同的域)。 假設用戶必須在iframe.html中嵌入幻燈片,他們可以通過添加以下行來添加:

這會將完整的HTML代碼從iframe.html帶到index.html,現在我需要一種方法來訪問iframe中的元素以調整其某些屬性。

跨域獲取iframe的html、就像代碼中一樣,用戶可以將iframe的寬度和高度設置為某些固定尺寸。 我想將幻燈片放映的大小(和包含的圖像)調整為iframe容器的大小。 做這個的最好方式是什么?

我嘗試以類似以下方式成功訪問iframe.html的iframe組件沒有成功

$('#iframe').contents();

但得到錯誤:

TypeError:無法調用方法“內容”為null

因此,我認為要實現iframe.html中的邏輯,其中幻燈片放映應檢查父對象的寬度和高度,并相應地設置其高度。

iframe框架使用、我很困惑,希望我的問題對大多數人有意義。 請隨時提出進一步的解釋。 感謝您的幫助。

Ajit S asked 2020-07-30T02:11:37Z

10個解決方案

56 votes

此行將檢索框架的整個HTML代碼。 通過使用其他方法代替innerHTML,您可以遍歷內部文檔的DOM。

document.getElementById('iframe').contentWindow.document.body.innerHTML

iframe是個啥?要記住的是,只有當幀源在同一域中時,這才起作用。 如果來自其他域,則將啟用跨站點腳本(XSS)保護。

Kna?is answered 2020-07-30T02:11:58Z

42 votes

試試這個代碼:

.find("html")

這將返回iframe中的所有html。 可以使用任何所需的選擇器來代替2988650206394319871987,例如:.find('body'),.find('div#mydiv')。

html、Chamara Keragala answered 2020-07-30T02:12:23Z

6 votes

var iframe = document.getElementById('iframe');

$(iframe).contents().find("html").html();

Dolo answered 2020-07-30T02:12:39Z

4 votes

html5 iframe替代方案。$(editFrame).contents().find("html").html();

Arun Yokesh answered 2020-07-30T02:12:55Z

2 votes

如果您在一臺iframe中具有以下Div,

11441551
Or

Some Text

jquery html方法,然后,您可以使用以下代碼查找這些Div的文本

var iContentBody = $("#ifrmReportViewer").contents().find("body");

var endLetterSequenceNo = iContentBody.find("#EndLetterSequenceNoToShow").text();

var divInnerFormText = iContentBody.find("#divInnerForm").text();

希望對您有所幫助。

Md. Nazrul Islam answered 2020-07-30T02:13:23Z

jquery iframe?2 votes

這對我有用,因為它在ie8中可以正常工作。

$('#iframe').contents().find("html").html();

但是,如果您希望將javascript用作jquery,則可以這樣使用

var iframe = document.getElementById('iframecontent');

var innerDoc = iframe.contentDocument || iframe.contentWindow.document;

html5 iframe、var val_1 = innerDoc.getElementById('value_1').value;

Hermes answered 2020-07-30T02:13:47Z

0 votes

僅供參考。 這是使用JQuery的方法(例如,當您無法按元素ID查詢時很有用):

$('#iframe').get(0).contentWindow.document.body.innerHTML

mxro answered 2020-07-30T02:14:07Z

htmliframe。0 votes

如果將jquery加載到iframe.html中,則這可能是另一種解決方案。

$('#iframe')[0].contentWindow.$("html").html()

toshi answered 2020-07-30T02:14:27Z

0 votes

為什么不嘗試Ajax,檢查代碼的第1部分或第2部分(使用注釋)。

htmliframesrcdoc?KingRider answered 2020-07-30T02:14:47Z

-2 votes

$('#iframe').load(function() {

var src = $('#iframe').contents().find("html").html();

alert(src);

});

jquery獲取iframe子頁面元素、akash answered 2020-07-30T02:15:03Z

https://www.nshth.com/php/313064.html
>

相关文章:

  • 跨域獲取iframe的html
  • iframe框架使用
  • iframe是個啥
  • html
  • html5 iframe替代方案
  • jquery html方法
  • jquery iframe
  • html5 iframe
  • 人工智能公司,世界人工智能大賽OCR賽題方案!
  • leetcode最長無重復字符串,Leetcode PHP題解--D62 976. Largest Perimeter Triangle
  • ubuntu grub>命令修復方法,Ubutnu18.04解決:Starting Wait until snapd is fully seeded...
  • 什么是終端,烏邦圖如何進入終端界面
  • 論文去重的方法,j簡單去重心得
  • 尚硅谷springboot學習課程筆記
  • 匯編語言指令大全及實例解析,【匯編語言】簡記
  • Spring認證,spring security oauth2 基于 RBAC 的自定義認證
  • 一點點門店管理系統,一點點對WebResource.axd的配置及使用[原創]
  • Jupyter安裝,jupyter安裝php,如何安裝jupyter
  • yzl工具箱最新版本,10yum工具使用
  • 唯一nft藝術品交易平臺官網,【Beeple同款】NFT 電子藝術畫框上架鏈作
  • 七種基本的css選擇器,CSS的背景屬性
  • php論壇,Yac - PHP擴展
  • apache配置php環境,Ubuntu 16.04 安裝php的拓展yac
  • mysql試題及答案,mysql獲取id最大的一條記錄_sql查詢表中ID最大的一條數據腫么寫?
  • c語言程序設計第二版,求兩個整數的較大值(C語言)
  • 煙火人間歌曲DJ版,計算機音樂煙火人間,煙火人間在線試聽_陸虎_高音質歌曲_九酷音樂
  • 梯形的立方公式,用梯形算定積分
  • 鴻蒙系統又不發布了,華為微博回應鴻蒙,果不其然,華為放出終極大招!鴻蒙操作系統下月正式推送。就在剛剛,華為開通了鴻蒙操作系統的官方微博,關注人數已接近八萬。?.
  • 驗證集loss變正確率不變,測試ResNet在ImageNet驗證集上的準確率
  • hydraforce,Hydra – Brute Force HTTP(S)
  • 機器人仿真軟件哪個好,ROS導航仿真和多點導航3——實現機器人巡檢功能
  • 無線寬帶移動路由器原理,路由器的原理和作用
  • 1134: 小青蛙,跳跳跳
  • ac2018kod決賽,2019HDU多校第十場
  • BUUCTF筆記之Web系列部分WriteUp(四)
  • 中國元宇宙平臺,元界快訊|首個物聯網元宇宙平臺“物聯森友會”即將上線
  • 可視化數據庫軟件,優锘科技:可視化加速“歷史數據庫”運轉
  • 網絡中url的含義是什么,常用網絡圖片url地址