웹사이트에서 iframe태그를 사용하여 다른 페이지를 불러오는 경우 내부의 엘리먼트에 접근해 css 스타일을 변경하려고 합니다. 가능할까요?# iframe으로 불러온 웹페이지 css 적용 가능 여부결론부터 말하면 css 스타일을 적용할 수 없습니다. iframe 태그 안에 존재하는 document는 해당 웹페이지에 적용된 css에만 영향을 미치게됩니다. 물론 가장 큰 이유는 보안에 따른 문제 소지가 있기 때문입니다. 혹시라도 iframe으로 웹페이지를 불러오는 특정 웹사이트가 악의적인 의도로 사용될 수도 있겠죠.! host가 동일한 경우에는 어떻게되는가?결론부터 얘기하면 hostname이 동일한 경우라도 결과는 같으며 적용되지 않습니다... 즉 subdomain이 다르고 호스트가 같은 상황이라도 불구하고 a.webisfree.com과 b.webisfree.com의 어느 한쪽을 iframe으로 불러온다고해도 스타일 적용은 안됩니다.결국 안전하고 유일한 방법은 해당 css 스타일은 페이
2018-05-28 17:54:26iframe 또는 frame 태그의 콘텐츠에 접근하는 방법은 무엇일까요?frames 컬렉션을 제외한 방법으로 contentDocument 프로퍼티를 사용하는 방법이 iframe 또는 frame DOM 요소에 접근 가능한 유일한 방법입니다. 아래와 같은 방식으로 document의 콘텐츠에 접근이 가능합니다.myIFrame = document.getElementById('myIFrame');myIFrame .contentDocument.document;Oriented Origin Policy에 의하여 동일 정책 위반인 경우에 해당하면 접근에 제한이 생길 수 있습니다.
2017-03-31 15:28:43embed 태그를 사용하여 유투브(Youtube) 영상을 콘텐츠에 삽입하는 경우 IE 8 에서 정상적으로 동작하지 않을 수 있다. 이 경우 어떻게 해야 정상적으로 IE 8 구버전에서 플레이가 가능한지 알아보고자 한다.먼저 embed 태그가 IE 8 에서 지원하지 않는 것 같다... 이를 해결하기 위해 아래와 같이 해당 태그를 다른 태그로 변경하면서 테스트를 실시하였다. 실시 환경은 Windows 7 IE 8 브라우저이다.1. object 태그2. video 태그3. iframe 태그위와 같이 세 가지 태그를 모두 사용하여 IE 8 에서 테스트한 결과는 다음과 같다.우선 1번과 2번 object와 video 태그는 IE 8 에서 아무것도 나오지 않았다. 마지막으로 iframe으로 변경한 결과? 정상적으로 IE 8 에서 동영상을 보여주었다. 결론적으로 IE 8을 지원하기 위해서는 iframe 태그를 사용하는 것이 좋을 것 같다.현재 대부분 IE 8을 지원하지 않으나 현재 XP 유저가 특
2016-04-04 19:37:18만약 자신의 웹사이트에 유투브 영상의 코드를 추가하여 보여주려고한다면? 이 경우 해당하는 동영상 코드를 iframe 태그를 사용하여 넣을 것이다. 그런데 이 태그를 넣었을때 정상적으로 동작한다면 Okay!이지만 정상 동작하지 않는 문제가 나타날 경우가 있다. 나타나는 증상은 아래와 같이 발견할 수 있다.! Youtube 영상 추가시 발생하는 이슈iframe 태그와 다른 태그가 겹치는 부분에 있어 z-index의 css 속성이 적상적으로 적용이 되었음에도 iframe태그가 우선되어 무조건 상위에 표시되어 나타나는 문제이와 같은 현상은 익스플로러(Internet Explorer, IE)에서 발견되며 다른 브라우저는 이런 현상이 나타나지 않을 수 있다. 이 경우 해결하기 위해서는 어떻게 해야할까?! 유투브 영상에서 z-index 문제가 나타나는 경우 해결방법일단 이 현상은 왜 나타날까? 그 이유는 유투브(youtube) 동영상 콘텐츠를 페이지에 넣을때 iframe내의 영상 콘텐츠가 무조건
2015-12-17 11:13:00iframe 태그를 이용해 외부 도메인 또는 URL 주소의 내용을 자신의 웹사이트에 보여주는 경우 ... 때때로 iframe의 DOM 영역에 접근할 필요가 있습니다. 이때 어떻게하면 가능한지 알아봅니다.# 자바스크립트 iframe 요소의 DOM에 접근하기iframe 태그의 DOM객체에 접근하기 위해서는 iframe 요소의 contentWindow 또는 contentDocument를 사용하여 가능합니다. 해당 속성은 iframe에 적용된 document객체를 반환합니다. iframeobj.contentWindow.document// iframe의 Window객체에 접근 iframeobj.contentDocument.document // iframe의 Document객체에 접근이제 iframe 내부의 document 문서를 조작하거나 정보를 가져올 수 있게되었습니다. 만약 동작하지 않는 경우라면 아래 사항을 확인해보세요. ! Cross Origin 정책 확인하기 보안에 따른 이슈로
2014-01-30 09:54:21
