document.createElement(“script”) synchronously

by

You can create your <script> element with an “onload” handler, and that will be called when the script has been loaded and evaluated by the browser.

var script = document.createElement('script');
script.onload = function() {
  alert("Script loaded and ready");
};
script.src = "http://whatever.com/the/script.js";
document.getElementsByTagName('head')[0].appendChild(script);

You can’t do it synchronously.

edit — it’s been pointed out that, true to form, IE doesn’t fire a “load” event on <script> tags being loaded/evaluated. Thus I suppose the next thing to do would be to fetch the script with an XMLHttpRequest and then eval() it yourself. (Or, I suppose, stuff the text into a <script> tag you add; the execution environment of eval() is affected by the local scope, so it won’t necessarily do what you want it to do.)

edit — As of early 2013, I’d strongly advise looking into a more robust script loading tool like Requirejs. There are a lot of special cases to worry about. For really simple situations, there’s yepnope, which is now built into Modernizr.

More Related Contents:

  1. How can I tell if a DOM element is visible in the current viewport?
  2. For loop for HTMLCollection elements
  3. How to get a DOM Element from a jQuery selector?
  4. How do I check if an element is really visible with JavaScript? [duplicate]
  5. “innerHTML += …” vs “appendChild(txtNode)”
  6. Is it possible to run an .exe or .bat file on ‘onclick’ in HTML
  7. Retrieving the text of the selected in element
  8. How can I add a class to a DOM element in JavaScript?
  9. getAttribute() versus Element object properties?
  10. How to get the HTML for a DOM element in javascript
  11. JavaScript DOMParser access innerHTML and other properties
  12. jQuery count child elements
  13. Adding images to an HTML document with JavaScript
  14. Do I need to remove event listeners before removing elements?
  15. What is the right way to make a synchronous MongoDB query in Node.js?
  16. Why does document.querySelectorAll return a StaticNodeList rather than a real Array?
  17. Override default behaviour for link (‘a’) objects in Javascript
  18. What is the difference between Window and window?
  19. How to get the title of HTML page with JavaScript?
  20. document.createElement(‘script’)… adding two scripts with one callback
  21. Alternative to DOMNodeInserted
  22. How browser executes Javascript and renders asynchronously
  23. How to properly unload/destroy a VIDEO element
  24. How to add a onclick event to an element using javascript
  25. How to get element by class name
  26. Test if an element can contain text
  27. How to do a wildcard element name match with “querySelector()” or “querySelectorAll()” in JavaScript?
  28. Replacement for deprecated `keypress` DOM event
  29. Screen Coordinates of a element, via Javascript
  30. Vanilla JS event delegation – dealing with child elements of the target element

Leave a Comment