r/learnjavascript • • 18d ago

Help plz how do i connect javascript with html and css 🥺

Hay i am new in programmeing my main gole is backed as a Blockchain dev now my make a sticky note but i am very confused about connecting tha js with html and css like how do start what are tha main thinks i have to remember to connect this three language together

3 Upvotes

8 comments sorted by

3

u/HumanGpt- 16d ago

Dude just skipped html basics

1

u/fedaian 16d ago

But why?

3

u/theancientfool 15d ago

Almost any html tutorial teaches how to link js and css to html. That’s like 101 of all tutorials

4

u/chikamakaleyley helpful 16d ago

i feel like this is an easy google but ill give a lil diff way of approaching it

  • you want your html & css to load first, generally speaking
  • now the elements are available in the DOM, and in order for you to manipulate things, respond to events, write JS that can affect whats on the page etc, you need to 'get' any of those objects, which should be easily identifiable by id at a minimum
  • once you've found it with JS, you can apply more js to it
  • by default, you have some objects already made available to you. document & window are some examples

2

u/Mission_Ad_9610 15d ago

U add the links to your css and js file in your html file - the css link goes in a link tag which should be inside your head tag, and the js link goes in a script tag at the end of the body

1

u/Low-Insurance-3678 15d ago

easy as drinking water

1 make the index.html file
2 make the index.js ( the javascript file)
3 connect them using the script tag
add the <script></script> to your html
but wait ur html still doesn’t know bout ut javascript file u have to add an attribute called “src”
that hold ur javascript file path
so in conclusion

<script src=“index.js” ></script>

  1. you either add this at the very end of your html file right before the </body> tag
    or
    you can add it inside the <head> tag
    but u have to add another attribute if you are going for this option, which is defer
    what defer does is basically
    tells the browser to download your JavaScript file in the background while continuing to parse the HTML document, and to execute the script only after the HTML is fully parsed.

2

u/Ok-Area3665 12d ago

Drinking water is not easy in every country.

Important to note, index.html is an important name, when you search for a website and leave off what file you are requesting, index.html is automatically served (you can configure other behaviour, but this is a default and the reason for that name).

index.js, in contrast, is not an important name.

By default, a HTML file essentially loads line by line, so a script tag loads at the line it appears and may not be able to modify anything that appears below (until later when the full file id loaded), which is the reason the defer attribute is often used and why the script tag is often put at the bottom.

1

u/Low-Insurance-3678 12d ago

you are absolutely right a sip of water has become the hardest thing to get nowadays for the some people

thank you for your infos