Chargement dynamique de fichiers js, css et autres à travers les compétences iframes

Chargement dynamique de fichiers js, css et autres à travers les compétences iframes_javascript

WBOY

Libérer： 2016-05-16 16:58:25

original

1225 Les gens l'ont consulté

1. Chargez dynamiquement les fichiers js et css (en utilisant js et jquery natifs)

structure iframe :
frame0 (parent)
frame2 (enfant)
frame3 (enfant)

Déclencher des événements dans frame2 et charger dynamiquement des fichiers js, css et des éléments dom dans frame3 ?

* Peut être appelé entre pairs, et peut être appelé de la manière enfant-parent-enfant
parent.parentFram("Cette méthode appelle une autre sous-ferme"); 1. jquery's append()

Copier le code Le code est le suivant :

Vitesse rapide et synchronisation (Besoin d'introduire jquery)

var oBody = document.getElementById("frame3_id").contentWindow.$("body");

var str = "

.. .< /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.src="/test.js";
var oTag1 = document.getElementById("frame3_id").contentWindow.document.getElementById("oScript1"); oBody.append (oScript);
}

document.getElementById("frame3_id").contentWindow.test(); // Appelez la méthode test() dans frame3_id

** ********************************
L'exemple ci-dessus : a. Besoin d'introduire jquery ;
** **********************************
appendChild() de 2.js

Vitesse lente, asynchrone (besoin de déterminer si js est chargé)

Exemple 2 :

Copier le code

Le code est le suivant : var str = "

...

" var popDiv=document.createElement('div'); 🎜>popDiv.style.xx = xxx ; popDiv.id = "pop"; popDiv.innerHTML = str;

var oBody = document.getElementById("frame3_id").contentWindow.document.getElementsByTagName ("corps")[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"); ) 
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(); // méthode test() Dans le fichier js importé 
}else{ 
console.info("impossible de charger le fichier oScript2.js"); 
} 
} 