HTML: After Dynamic JavaScripts Loaded Completely -


i loading javascript files dynamically in page:

<html>  <head>     <script type="text/javascript">         window.onload = function () {             var script1 = document.createelement('script'),                 script2 = document.createelement('script'),                 script3 = document.createelement('script');              script1.type = 'text/javascript';             script1.src  = 'myscript1.js';             script2.type = 'text/javascript';             script2.src  = 'myscript2.js';             script3.type = 'text/javascript';             script3.src  = 'myscript3.js';              document.body.appendchild(script1);             document.body.appendchild(script2);             document.body.appendchild(script3);         }     </script> </head>  <body>  </body> </html>

i need know when these scripts loaded completely. there workaround or code snippets this?

before document.body.appendchild

scrimpt1.addeventlistener('load', function() { console.log('loaded'); });

obviously you'll want "something useful" instead of simple console.log i've shown

but ... isn't realiable

try this

var numscripts; function scriptloaded() {     numscripts --;     if(numscripts == 0) {         console.log('huzzah scripts loaded');     } }

then, code

    window.onload = function () {         var script1 = document.createelement('script'),             script2 = document.createelement('script'),             script3 = document.createelement('script');         numscripts = 3;         script1.type = 'text/javascript';         script1.src  = 'myscript1.js';         script2.type = 'text/javascript';         script2.src  = 'myscript2.js';         script3.type = 'text/javascript';         script3.src  = 'myscript3.js';          document.body.appendchild(script1);         document.body.appendchild(script2);         document.body.appendchild(script3);     }

at end of each of scripts, put like

if(windows.scriptloaded) {     scriptloaded(); }

-

Comments

Post a Comment