Google Chrome loads the javascript first even I put the script tag before the end of the body tag

Question

I have a problem with loading JavaScript in Google Chrome.
I\'ve created the separate js file with a simple alert message and then linked it before the end of the body

Answer 1

Try including jquery cdn just above your script tag in body.

<script
  src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
  integrity="sha256-3edrmyuQ0w65f8gfBsqowzjJe2iM6n0nKciPUp8y+7E="
  crossorigin="anonymous">
</script>

This will work fine!!

Answer 2

async and defer boolean attributes are only helpful when the script is inserted in the head portion of the page. They are useless if you put the script in the body footer like we saw above.

(Refer following article: https://flaviocopes.com/javascript-async-defer/).

I am also facing similar issue and using window.onload = funcRef; with cleared cache also does not work on my google chrome. I have tried all of this with disabling all my browser extensions but in vain.

I was finally able to, not solve, but agree upon a way around - which was - to include a

jQuery CDN

before my javascript script in the body. Hope this helps.

Answer 3

That is a problem with Chrome. The developers of chrome for some reason have still not corrected that. If you have alert or a prompt pop-up, which is the first thing that user has to interact with in your website, chrome will not load HTML until after the pop-up has been closed.

Answer 4

Your problem is that your script have the tag async, which let it execute whitout taking care of the web page loading state. Remove the async tag, or replace it with defer, which execute the script after the page loading.

In order to prevent any problem with script and html/css loading times conflict, you should encapsulate your Javascript's scripts with window.onload = function() { //code here }. This will guarantee that your whole page is loaded before executing your code.

Answer 5

I also had this problem and realized that my Google chrome was just loading the cached version of page(the one before putting my script tag near bottom). Closing the window and reopening the page worked fine.