I am trying to load an ad script right after the page has loaded. Usually, the ad script looks like this
<script id="someId" language="javascript">
someVar = thisValue;
somethingElse
</script>
Notice that it got already a <script> tag on it, removing it does not render the ad. So, it got to be in there no matter what, moreover, those things inside shouldn't be modified.
The problem with this is, I could not attempt to place it in a function.
I was trying to do this, to lunch the <script> tag on load
<script type="text/javascript">
function load() {
//this is were the add goes
<script id="someId" language="javascript">
someVar = thisValue;
somethingElse
</script>
}
</script>
Then lunch the function by means of
<script type="text/javascript">window.onLoad = load;</script>
So that is technically what I am trying to do, but I cant get this code executed. What would be the best, to run the '' tag ad after page load?
I am trying to load an ad script right after the page has loaded. Usually, the ad script looks like this
<script id="someId" language="javascript">
someVar = thisValue;
somethingElse
</script>
Notice that it got already a <script> tag on it, removing it does not render the ad. So, it got to be in there no matter what, moreover, those things inside shouldn't be modified.
The problem with this is, I could not attempt to place it in a function.
I was trying to do this, to lunch the <script> tag on load
<script type="text/javascript">
function load() {
//this is were the add goes
<script id="someId" language="javascript">
someVar = thisValue;
somethingElse
</script>
}
</script>
Then lunch the function by means of
<script type="text/javascript">window.onLoad = load;</script>
So that is technically what I am trying to do, but I cant get this code executed. What would be the best, to run the '' tag ad after page load?
Share Improve this question edited Jul 6, 2020 at 2:15 Jones G asked Nov 11, 2017 at 2:52 Jones GJones G 3235 silver badges18 bronze badges4 Answers
Reset to default 3Easy way to handle your jQuery before or after page loads:
jQuery(function($){
// Use jQuery code here with $ formatting.
// Executes BEFORE page finishes loading.
});
jQuery(document).ready(function($){
// Use jQuery code here with $ formatting.
// Executes AFTER page finishes loading.
});
Then inside second section, which handles jQuery after page loads, use jQuery.getScript() to load your Javascript file:
$.getScript('/js/main.js');
If you would like new JS to fire off as soon as JS file loads, simple done like so:
$.getScript('/js/main.js', function() {
// Executes AFTER main.js file is loaded.
});
Click here for jsFiddle example.
ES6 Update
Here's the ES6 version of the script using the arrow function:
// Executes before page finishes loading.
document.addEventListener('DOMContentLoaded', () => {
// Use JavaScript code here.
});
In the first example, we use the DOMContentLoaded event to execute the code when the HTML document has been pletely loaded and parsed.
// Executes after page finishes loading.
window.addEventListener('load', () => {
// Use JavaScript code here.
});
In the second example, we use the load event to execute the code after all page content has been loaded, including images and other external resources.
A quick search for lazy loading found this
<script>
var resource = document.createElement('script');
resource.async = "true";
resource.src = "http://example./script.js";
var script = document.getElementsByTagName('script')[0];
script.parentNode.insertBefore(resource, script);
</script>
Well, there are 2 major mistakes:
- window.onload = load; (not onLoad)
It doesn't make sense to write the
<script>inside of the function declaration<script> function load() { //this is were the add goes someVar = thisValue; somethingElse } window.onload = load; </script>
Can't you write something like that?
If you can't, at least, try to move your <script> to the end of <body>.
Placing scripts at the bottom of the element improves the display speed, because script pilation slows down the display.
If you really need <script id="someId" language="javascript">,
just place it this way:
<script id="someId" language="javascript">
function load() {
//this is were the add goes
someVar = thisValue;
somethingElse
}
window.onload = load;
</script>
Try this way:
<script async src="url_to_ad"></script>
It may work. The boolean async attribute on script elements allows the external JavaScript file to run when it's available, without delaying page load first.