New course! Every coder should learn Generative AI!
Try a free lesson+ 23
Which is the Best place to put <script> tag?
Responsive place : In the beginning of head tag Or In the beginning of body tag Or At the end of head tag Or At the end of Body tag
37 Answers
+ 11
Just before </body>
This is because there are chances that you try to access elements that has not been rendered yet.
//Below code snippet will log "div is not rendered"
<head>
<script>
if(document.getElementById("my-div")){
console.log("div is rendered");
}
else {
console.log("div is not rendered");
}
</script>
</head>
<body>
<div id="my-div">Hello World!!</div>
</body>
+ 10
Yes, there seems to be varying preferences. But according to the Stack Overflow post that Rocket Raccoon posted, and which he reiterated in his last post, the current recommendation seems to be at the beginning of the <head> tag with either defer or async attributes. It also seems that which of these attributes to use depends on the type of script. Additionally, it seems that about 6% of browsers don't support the two attributes mentioned.
+ 10
حمودي العبد
We know you are new here.
Lets read some rules of SOLOLEARN before using.
Dont be upset that everyone dislike your answer, Actually your answers is quite Awkard here.
You can talk with us through message medium of sololearn
By the way
WELCOME TO THE SOLOLEARN
LEARN LANGUAGES AND CREATE YOUR CODE BY YOUR IDEAS.
https://www.sololearn.com/discuss/1316935/?ref=app
HAPPY CODING.
and Guys take A chill pill
he is new
He doesn't know the rules.
+ 8
Just before the closing body tag </body>,in addition to what Rishi Anand said quite correctly,it is also because you do not want to delay your page from rendering the necessary html and styling pages while the JS engine processes the script document.
+ 8
Inside head tag it's better
+ 7
In typical good programming in the head.
When you're dealing with Sololearn Code Playground, at the end of a body
+ 7
Best to worst order.
Before starting of body tag >at the last part of body tag>anyplace where you want except these two
+ 6
At the end of head tag
+ 5
Rishi Anand but the question did not specify whether it is inline or external JS, did it?
+ 5
Inside the body tag at the last part. Usually the code does not work because the html is not yet rendered. Even though this might slow your performance, this is the recommended way to go.
If there are functions however, those are recommended in the head tag
+ 5
In the beginning of head tag.
+ 4
in the end of body tag even it's external.
edit : ok I was wrong you should put in head, here I just read
https://stackoverflow.com/questions/436411/where-should-i-put-script-tags-in-html-markup
+ 4
ThankGod Imabibo The current state-of-the-art is to put scripts in the <head> tag and use the async or defer attributes. This allows your scripts to be downloaded asap without blocking your browser.,
There was a time where putting javascript in the end of body tag was a good practice.
+ 4
In head tag, but with attribute "defer".
+ 4
The best place to put the script tag is at the bottom of the <body> element.
That way, you don't have to wrap up your code in a cluttering "window.onload" method
+ 4
What actually happens is anything that is part of the DOM, or the part that is rendered is inside of the body element. Usually, the styles and scripts are loaded in the head element. Even though this is true, any script that uses part of the DOM or the html render will not work. So, what I would recommend is to load in any extra scripts and css in the head such as jQuery and Bootstrap and Vue and such inside of the head element. The script that goes in the body is loaded in with the DOM.
So, during the time of render of the script of the head element will not be able to use the DOM objects or the html renders until the html is fully loaded. But the script in the body element will be able to use the DOM elements or the html renders. During the time of render that is.
So, functions that use the DOM elements can be loaded into the head element if they are not going to be executed in the head element.
+ 4
That was written on mobile yes, hopefully you appreciate that
+ 4
Header / Footer IMHO 😎
+ 4
Many web developers recommend loading JavaScript code at the bottom of the page to increase responsiveness, and this is even more important with the HTML service.
All scripts you load are scanned and sanitized client-side, which may take a couple of seconds.
Moving your tags to the end of your page in body tag will let HTML render all your webpage content before the JavaScript is processed.
+ 3
Sonic yes it didn't specify
That's why the answer should be in a way that should support for both inline and external
Often have questions like this?
Learn more efficiently, for free:
Hot today
Help with homework
0 Votes
please help me emotionally
1 Votes
Logical operator
1 Votes
While loop problem maybe?
2 Votes