DEV Community

Cover image for Where to put the js script tag
Gaurav Vala
Gaurav Vala

Posted on

1 1

Where to put the js script tag

Intro

While using External JavaScript file there are 2 ways by which you can attach the file to html document

  1. In the head tag
  2. Befor body tag is closed

Now according to how you attached your javascript file in html document, it may behave differently like html tag not getting selected.

The preferred way of attaching js file is to add to end, before the body tag is closed, let's see why.

Why use it at end?

The index html file in your project will be executed first in the project and there a hierarchy of html elements will be created which will be executed top to bottom.

Attaching it in head tag

When you attach your js file in the head tag the js file will be running before your html is rendered and that means whenever you'll be trying select an element in javascript it will give error because that element is not rendered and javascript file can't find it. It is like using a variable before it was defined.

Attaching it before body tag is closed

So when you attach your js file at the end of the document, every element will be rendered first and at last the javascript file will be executed and that means it will have access to every element in your html document.

There are ways to make it work perfectly even after attaching it into head tag, but personally i feel like this is more cleaner way.


If you found the content i share useful than share it with your developer friends and also follow me on Instagram and Twitter

AWS Q Developer image

Your AI Code Assistant

Automate your code reviews. Catch bugs before your coworkers. Fix security issues in your code. Built to handle large projects, Amazon Q Developer works alongside you from idea to production code.

Get started free in your IDE

Top comments (0)

Postmark Image

Speedy emails, satisfied customers

Are delayed transactional emails costing you user satisfaction? Postmark delivers your emails almost instantly, keeping your customers happy and connected.

Sign up

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay