Inject external javascript file in html body after page load

Question

I want to load an external javascript after page is loaded. Actually the javascript contains source for an ad and its making page load slow. All I want is to delay loading & execution of ads to make sure fast page load.

thanks, Bilal

Solution 1

You may just use this script at the last tag of your body block:

<script type="text/javascript">
   var script = document.createElement('script');
   script.setAttribute('src', 'http://yourdomian.com/your_script.js');
   script.setAttribute('type', 'text/javascript');
   document.getElementsByTagName('head')[0].appendChild(script);
</script>

Solution 2

var script=document.createElement('script');
script.type='text/javascript';
script.src=url;

$("body").append(script);

Courtsey

Solution 3

I would look at using asynchronous Javascript loading. There are frameworks for this such as requireJS.

Solution 4

$("#selector").click(function(){ $.getScript("YourScript.js"); });

Then Run what is implemented in that script

View more solutions