How do you combine Javascript and HTML?

How do you combine Javascript and HTML?
0

#1

So, i was looking at the curriculum and was suprised to find that there was no lesson for using JS in combination with HTML. I am trying to learn how to combine them as fast as i can so i can build something worthy to put in my resume. I used google to find what projects i can do in JS and one i found was a JS quiz game. But looking at the code, i see a lot of joining the HTML to JS and i dont know where they pulled the functions they use out from.

Any place you know where i can learn


#2

If you were to make everything from scratch, and not use a place using codepen, You would first use the link tag for any external js files.


#3

i dont know what that is


#4

You’ll find out in the future if you go through the curriculum.


#5

can you tell me where in the column. I do not have time to go through the curriculum right now. I just need to skip ahead for now.


#6

And if you build something in codepen, you can export it to a zip file with the right file structure.

But looking at the code, i see a lot of joining the HTML to JS …

I’m not sure what you mean by “joining”. As zap said, you will learn more about this as you go on. When you get to the Front End Libraries.

…and i dont know where they pulled the functions they use out from.

That depends on what they are. If you can quote and actual line of code, we can help you better. It might be jQuery or React (like you’ll learn about in the FE Libraries section) or it could be vanilla JS. There are different ways to do it. I’m sure there are also youtube videos that you can watch that tie it all together. The forum tends to do better at very specific questions, not open ended things.


#7

The curriculum is fairly progressional. I don’t know if that would be a good idea. The FE Libraries depend on a good knowledge of JS and HTML and CSS.

Where in the curriculum are you?


#8

Things like this:
submitButton.addEventListener('click', showResults)
const quizContainer = document.getElementById('quiz');


#9

In javascript. Intermediate algorithm scripting. I have a career fair thingy and need at least a project that i have built on my resume. after the career fair i can take my time with the curriculum. But i need to build something now


#10

Learn to start looking up docs. This is all basic JS for interacting with the DOM (the virtual representation of the page in the browser). Here it talks about addEventListener.

submitButton.addEventListener('click', showResults)

This takes a selector (a variable holding a reference to something in the DOM) that was probably defined earlier to add and event listener it is listening for a mouse click and when that happens it will fire a function called showResults that was defined elsewhere. This is how you get mouse clicks to run JS.

const quizContainer = document.getElementById('quiz');

This is defining a new selector, it is looking in the DOM for an element with and id of “quiz”.

In javascript. Intermediate algorithm scripting. I have a career fair thingy and need at least a project that i have built on my resume. after the career fair i can take my time with the curriculum. But i need to build something now

I can understand your impatience, but you also have to understand that these things take time. You might try and tackle the Random Quote Machine or something in that category.

As to the general concepts, things like this might help. That and look up keywords on youtube and follow along. If you get stuck on something, google it and if you can’t find it check the forum. Just be very specific.