[JavaScript] Checking if iframe contents are loaded? : iframe 로딩 완료 이벤트 확인

 

[Question] 

Checking if iframe contents are loaded?

 

 

[Answer] 

To be notified when the iFrame is loaded, you can still use the onload event today.

Create the iFrame and set an ID for JavaScript:

<iframe id="test" src="SRC_URL"></iframe>

Now access the iFrame with JavaScript and set an EventListener for the load event:

const iframe = document.getElementById("test");
iframe.addEventListener("load", function() {
    console.log("Finish");
});

When the iFrame has finished loading, "Finish" is logged in the console. I have tested it with Google Chrome and it works fine.

Within the EventHandler you can then perform actions. For example, send a message:

iframe.contentWindow.postMessage({ title: "Hi", message: "Seems to work" }, targetOrigin);

Please also make sure that you have permission to embed the web page (X-frame options).

 

경축! 아무것도 안하여 에스천사게임즈가 새로운 모습으로 재오픈 하였습니다.
어린이용이며, 설치가 필요없는 브라우저 게임입니다.
https://s1004games.com

[출처] https://stackoverflow.com/questions/60461930/checking-if-iframe-contents-are-loaded

 

 

 

 

 

 

 

 

본 웹사이트는 광고를 포함하고 있습니다.
광고 클릭에서 발생하는 수익금은 모두 웹사이트 서버의 유지 및 관리, 그리고 기술 콘텐츠 향상을 위해 쓰여집니다.
번호 제목 글쓴이 날짜 조회 수
254 [JavaScript] JavaScript / Object / Element.removeAttribute() / 요소의 속성을 제거하는 메서드 졸리운_곰 2024.05.18 402
253 [JavaScript] How to select all tag elements with JS 졸리운_곰 2024.05.18 11105
252 [HTML] DIV를 통해 일반적인 헤더를 만들어 보자. file 졸리운_곰 2024.05.18 369
251 [JavaScript] 자바스크립트 javascript 정규식 replace html 제거 태그 제거 졸리운_곰 2024.05.18 620
250 [HTML] Set display:none not working. : display : none 이 동작하지 않습니다. 졸리운_곰 2024.05.18 499
» [JavaScript] Checking if iframe contents are loaded? : iframe 로딩 완료 이벤트 확인 졸리운_곰 2024.05.18 533
248 [HTML] How TO - Get Iframe Elements : javascript로 iframe 요소에 접근 졸리운_곰 2024.05.18 486
247 [HTML] form submit redirection 리다이렉션 없이 자기 페이지에 결과 표시 : <form> 태그의 target 속성 졸리운_곰 2024.05.17 485
246 [HTML] form submit redirection 리다이렉션 없이 자기 페이지에 결과 표시 : iframe으로 form 응답값 받기 졸리운_곰 2024.05.17 481
245 [JavaScript] 자바스크립트 DIV 보이기, 숨기기(토글) 졸리운_곰 2024.05.16 501
244 [JavaScript] [JS] XPath로 element 찾기 file 졸리운_곰 2024.05.16 495
243 [JavaScript] How to clone (and restore) a DOM subtree 졸리운_곰 2024.05.16 325
242 [JavaScript] Force-DOM-reflow-JS 졸리운_곰 2024.05.16 522
241 [JavaScript] Javascript XPath를 이용해서 Dom Element 가져오기 졸리운_곰 2024.05.15 496
240 [JavaScript] Introduction to using XPath in JavaScript 졸리운_곰 2024.05.15 504
239 [JavaScript] JavaScript :: 요소 가져오기 file 졸리운_곰 2024.05.15 579
238 [JavaScript] lastIndexOf() : String에서 원하는 값의 마지막 위치(index) 찾기 졸리운_곰 2024.02.28 366
237 [JS] 문자열의 위치 찾기 & 문자열 추출하기 file 졸리운_곰 2024.02.28 573
236 [JavaScript] lastIndexOf() : String에서 원하는 값의 마지막 위치(index) 찾기 졸리운_곰 2024.02.28 544
235 [Javascript] Toggle Between Grid and List View in React file 졸리운_곰 2024.02.23 276
대표 김성준 주소 : 경기 용인 분당수지 U타워 등록번호 : 142-07-27414
통신판매업 신고 : 제2012-용인수지-0185호 출판업 신고 : 수지구청 제 123호 개인정보보호최고책임자 : 김성준 sjkim70@stechstar.com
대표전화 : 010-4589-2193 [fax] 02-6280-1294 COPYRIGHT(C) stechstar.com ALL RIGHTS RESERVED