www.webdeveloper.com
Results 1 to 5 of 5

Thread: Dynamically load scripts in Opera

  1. #1
    Join Date
    Sep 2009
    Posts
    33

    Dynamically load scripts in Opera

    Hi folks,

    I've spent some time browsing the multitude of blogs and discussions around dynamically loading scripts, and although there are a lot of very informative and ready-made solutions as it were, I prefer to work through a solution in an attempt to understand the approaches.

    In doing so, I've come across an issue with Opera (9.64 in this instance) which perhaps someone could shed some light on.

    Put simply, I have a list of scripts to load when the page loads. I keep a count of the number of scripts, and as each script is loaded (readyState / onload) increment another count. When the number of scripts loaded match the total, a method in one of the loaded scripts is called.

    This approach appears to be fine in IE/Firefox/Safari, but in Opera the load event is triggered (readyState = loaded) but the loaded scripts do not appear to have executed as the methods are not available. I have read about some implementation differences in Opera relating to script execution deferral and was wondering if this a possible cause? I've seen timers etc. used in similar scripts for Safari but would like to know if this is the cause of this behavior in Opera.

    A sample page illustrating what I'm attempting is available at the following URI: Opera test

    The main script is attached below. Any suggestions would be welcome.

    Thanks,

    Baps.

    Code:
    var scripts = {
      "test1.js" : "test1",
      "test2.js" : "test2",
      "test3.js" : "test3"
    }
    
    var totalCount = 0;
    var loadCount = 0;
    
    window.onload = function() {
      for(var i in scripts){
        totalCount++;
        addScript(i, scripts[i], function(){ isLoaded(); });
      }
    }
    
    function isLoaded(){
      
      if(loadCount == totalCount){
        test.msg();
        test1.msg();
        test2.msg();
        test3.msg();
      }
    }
    
    function addScript(src, id, fn){
      var s = document.createElement('script');
      s.src = src;
      s.id = id;
      s.type = 'text/javascript';
    
      if (s.readyState){
        s.onreadystatechange = function(){
          if (s.readyState == "loaded" || s.readyState == "complete"){
            s.onreadystatechange = null;
            loadCount++;
            fn();
          }
        };
      } else {
        s.onload = function(){
          loadCount++;
          fn();
        };
      }
      
      document.getElementsByTagName('body')[0].appendChild(s);
    }
    
    var test = {
      msg : function(){ alert("test script"); }
    }

  2. #2
    Join Date
    Jun 2007
    Posts
    667
    Quote Originally Posted by Baps View Post
    Code:
    function addScript(src, id, fn){
      var s = document.createElement('script');
      s.src = src;
      s.id = id;
      s.type = 'text/javascript';
    
      if (s.readyState){
        s.onreadystatechange = function(){
          if (s.readyState == "loaded" || s.readyState == "complete"){
            s.onreadystatechange = null;
            loadCount++;
            fn();
          }
        };
      } else {
        s.onload = function(){
          loadCount++;
          fn();
        };
      }
    Try applying the src after installing the handler.

  3. #3
    Join Date
    Oct 2003
    Location
    Andover, UK
    Posts
    947
    Is this specific to 9.64? I've used Opera as my main browser since v7 and never had any issues with events (except for the annoying habit in Opera of dialogue boxes occasionally failing to interrupt scripts as they really should).

  4. #4
    Join Date
    Jul 2008
    Location
    urbana, il
    Posts
    2,787
    Quote Originally Posted by Baps View Post
    but in Opera the load event is triggered (readyState = loaded) but the loaded scripts do not appear to have executed as the methods are not available.

    try replacing "fn();" with "window.setTimeout(fn, 35);"

  5. #5
    Join Date
    Sep 2009
    Posts
    33
    Thanks for the suggestions guys.

    Quote Originally Posted by mitya View Post
    Is this specific to 9.64? I've used Opera as my main browser since v7 and never had any issues with events (except for the annoying habit in Opera of dialogue boxes occasionally failing to interrupt scripts as they really should).
    I'm not sure. Is there any way to test with multiple versions without VM'ing them?

    Quote Originally Posted by Sterling Isfine View Post
    Try applying the src after installing the handler.
    The order of the src appears to have no effect. I'm assuming the script is not "fetched" until it's added to the live DOM?

    Quote Originally Posted by rnd me View Post
    try replacing "fn();" with "window.setTimeout(fn, 35);"
    This does indeed solve the problem. Could you possibly explain why? Is the 35 an arbitrary number? I.e. would a very large script require a larger timeout?

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles