IFrame, css 파일을 공유하는 방법

Question

방금 ​​웹 사이트 생성을 위해 sap netweaver를 사용하는 프로젝트에 참여했습니다.

지금까지 사람들은 DCP를 개별적으로 작업했기 때문에 이제는 20 개의 DCP를 연결하여 스타일을 조정할 수 있습니다.

루트에서 각 DCP는 IView/IFrame입니다.

우리는 현재 유지 보수가 쉽지 않고 빠르게 변경할 수 있도록 20 개의 CSS 파일을 가지고 있습니다. 그래서 scss를 사용하여 모든 것을 작동시키는 1 개의 CSS 파일을 생성하려고합니다.

그 부분은 잘 작동하지만 각 IFrame 자체가 렌더링되기 때문에 각자 CSS 파일을로드하므로 20 개의 새 CSS 파일을 호출 할 수 있으므로 문제가 발생합니다.

상위 뷰와 IFrame간에 css 파일을 공유하거나 적어도 css 파일을 다운로드하고 다른 파일 19는 캐시 된 버전을 사용하도록 설정하는 방법이 있습니까?

건배

제이슨

Answer 1

<script type="text/javascript"> 
    $(document).ready(function() { 
    //pulling all <style></style> css of parent document 
    if (parent) { 
     var oHead = document.getElementsByTagName("head")[0]; 
     var arrStyleSheets = parent.document.getElementsByTagName("style"); 
     for (var i = 0; i < arrStyleSheets.length; i++) 
      oHead.appendChild(arrStyleSheets[i].cloneNode(true)); 
    } 
//pulling all external style css(<link href="css.css">) of parent document 
    $("link[rel=stylesheet]",parent.document).each(function(){ 
     var cssLink = document.createElement("link") 
     cssLink.href = "http://"+parent.document.domain+$(this).attr("href"); 
     cssLink .rel = "stylesheet"; 
     cssLink .type = "text/css"; 
     document.body.appendChild(cssLink); 
    }); 
    }); 
</script> 

그것은 것이다 부모 문서의 태그에 정의 된 외부 스타일 시트에 정의 된 CSS뿐만 아니라 CSS를 상속 할 수.