1. Dynamically loading Js,css files (with native JS and jquery)
IFRAME structure:
FRAME0 (parent)
Frame2 (sub)
Frame3 (sub)
Triggering events in Frame2, dynamically loading JS, CSS files, and DOM elements into Frame3?
* Can be called between siblings, you can call the sibling through the child-parent-child method
Parent.parentfram ("This method is calling other child Farme");
1.jquery of Append ()
Copy Code code as follows:
Fast, synchronized (need to introduce 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 (); Call the test () method in frame3_id
***********************************
The above example: a. need to introduce jquery;
***********************************
2.js of AppendChild ()
Slow, asynchronous (need to determine whether JS is finished loading)
2:
Copy Code code as follows:
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 similar)
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 () method in the introduction of JS file
}else{
Console.info ("Can not load the Oscript2.js file");
}
}