iframe & contentDocument & contentWindow All In One

js get iframe document content / js get iframe window

contentDocument

// const iframeDocument = document.getElementsByTagName("iframe")[0].contentDocument;

const iframeDocument = document.querySelector("#iframe").contentDocument;

iframeDocument.body.style.backgroundColor = "blue";

Same Origin

https://developer.mozilla.org/en-US/docs/Web/Security/Same-origin_policy

https://developer.mozilla.org/en-US/docs/Web/API/HTMLIFrameElement/contentDocument

contentWindow

// const iframeWindow = document.getElementsByTagName("iframe")[0].contentWindow;

const iframeWindow = document.querySelector("#iframe").contentWindow;

iframeWindow.document.body.style.backgroundColor = "blue";

https://developer.mozilla.org/en-US/docs/Web/API/HTMLIFrameElement/contentWindow

demos

CORS ⚠️

https://cdn.xgqfrms.xyz/iframe/same-origin-iframe.html ✅

https://cdn.xgqfrms.xyz/iframe/iframe-single-testing.html ❌

const iframeDocument = document.querySelector("#sina").contentDocument;
iframeDocument.body.style.backgroundColor = "blue";
// 'blue'

const iframeWindow = document.querySelector("#sina").contentWindow;
iframeWindow.document.body.style.backgroundColor = "red";
// 

refs

https://www.cnblogs.com/xgqfrms/p/10312189.html

https://www.cnblogs.com/xgqfrms/p/16449386.html

©xgqfrms 2012-2020

www.cnblogs.com/xgqfrms 发布文章使用：只允许注册用户才可以访问！

原创文章，版权所有©️xgqfrms, 禁止转载

标签：contentDocument,https,contentWindow,iframe,xgqfrms,document
来源： https://www.cnblogs.com/xgqfrms/p/16449597.html