這篇文章主要介紹了動態加載js、css等文件跨iframe實現的方法,需要的朋友可以參考下
1、動態加載js，css文件(用原生js和jquery) iframe結構： frame0(父) frame2（子） frame3（子） frame2中觸發事件，動態的向frame3中 加載js、css文件和 dom元素？ *同級之間可以調用，可以 通過 子-父-子 的方式調用同級 parent.parentFram(“這個方法在調用其他子farme”); 1.jquery的append() 代碼如下: 速度快，同步（需要引入jquery） var oBody = document.getElementById("frame3_id").contentWindow.$("body"); var str = "<div>...</div>" var scriptTag = document.getElementById("frame3_id").contentWindow.document.getElementById("pop"); if(!scriptTag){ oBody.append(str); } var oScript= document.createElement("script"); oScript.id = "oScript1"; oScript.type = "text/javascript"; oScript.src="/test.js"; var oTag1 = document.getElementById("frame3_id").contentWindow.document.getElementById("oScript1"); if(!oTag1){ oBody.append(oScript); } document.getElementById("frame3_id").contentWindow.test(); // 調用frame3_id 中的test()方法 *********************************** 上述例子：a.需要引入jquery； *********************************** 2.js 的appendChild() 速度慢，異步（需要判斷js是否加載完畢） 列子2： 代碼如下: var str = "<div>...</div>" var popDiv=document.createElement('div'); popDiv.style.xx = xxx; popDiv.id = "pop"; popDiv.innerHTML = str; var oBody = document.getElementById("frame3_id").contentWindow.document.getElementsByTagName("body")[0]; var oHead = document.getElementById("frame3_id").contentWindow.document.getElementsByTagName("head"); if(oHead && oHead.length){ oHead = oHead[0]; }else{ oHead = oBody; } var elemDivTag = document.getElementById("frame3_id").contentWindow.document.getElementById("pop"); if(!elemDivTag){ oBody.appendChild(popDiv) } var oScript= document.createElement("script"); （css類似） oScript.id = "oScript1"; oScript.type = "text/javascript"; oScript.src="/test.js"; var scriptTag = document.getElementById("main").contentWindow.document.getElementById("oScript1"); if(!scriptTag){ oHead.appendChild(oScript); } oScript.onload = oScript.onreadystatechange = function(){ if ((!this.readyState) || this.readyState == "complete" || this.readyState == "loaded" ){ document.getElementById("main").contentWindow.test(); // test()方法 在 引入的js文件中 }else{ console.info("can not load the oScript2.js file"); } }